如何在ajax中显示警报/回声消息


how to display alert/echo messages in ajax

嗨,我有一个简单的表单和实现一个ajax脚本。我的问题是如何显示其他php文件的echo消息,这是user-file-upload.php?

我也想问如果我做ajax正确的方式。我现在对ajax完全是个新手。希望你能在正确的方向上帮助我。由于

这是我的表格

 echo "<form action='portal-files/user-file-upload.php' method='post' enctype='multipart/form-data' id='test_ajax'>";
    echo "<input type='hidden' name='MAX_FILE_SIZE' value='100000' />";
    echo "<input type='hidden' name='admin_id' value='$user->id' />";
    echo "<select name='id' id='form-option' class='test-only'>";
    echo '<option selected="selected">' .'Choose a User'. '</option>';
    foreach ($registeredUsers as $key => $value) {
      $registered = JFactory::getUser($value);
      echo '<option value="'.$registered->id.'">'.$registered->name.'</option>';
    }
    echo "</select>";
    echo "<input name='uploadedfile' type='file' id='custom-file-input' class='test-only' /> <br/>";
    echo '<input type="submit" name="submit" value="Upload" id="custom-submit-input" disabled="disabled" >';
    echo '<span id="display_file"></span>';
    echo '<span id="display_user" style="visibility:hidden"></span>';
    echo "</form>";

这里是user-file-upload.php

<script src="https://cdn.rawgit.com/t4t5/sweetalert/master/dist/sweetalert.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.rawgit.com/t4t5/sweetalert/master/dist/sweetalert.css">
<?php

define( '_JEXEC', 1 );
define( 'DS', DIRECTORY_SEPARATOR );
define( 'JPATH_BASE', realpath(dirname(__FILE__).DS.'..' ));

require_once ( JPATH_BASE .DS.'includes'.DS.'defines.php' );
require_once ( JPATH_BASE .DS.'includes'.DS.'framework.php' );

$target_dir = "../portal-files/";
$target_file = $target_dir . basename($_FILES["uploadedfile"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);

// Check if file already exists
if (file_exists($target_file)) {
    echo "Sorry, file already exists.";
    $uploadOk = 0;
}
// Check file size
if ($_FILES["uploadedfile"]["size"] > 500000) {
    echo "Sorry, your file is too large.";
    $uploadOk = 0;
}
// Allow certain file formats
if($imageFileType != "doc" && $imageFileType != "docx" && $imageFileType != "xlsx") {
    echo "Sorry, only DOC, DOCX, XLXS.";
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
    echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
} else {
    if (move_uploaded_file($_FILES["uploadedfile"]["tmp_name"], $target_file)) {
        echo "The file ". basename( $_FILES["uploadedfile"]["name"]). " has been uploaded.";
        if(isset($_POST['id']))
        {
            $selectedValue = $_POST['id'];
            $adminabc = $_POST['admin_id'];
            $imageFileName = basename( $_FILES["uploadedfile"]["name"]);

            $db = JFactory::getDbo();
            $query = $db->getQuery(true);
            $query = "INSERT INTO joom_fss_user_files (user_id,admin_id) VALUES ($selectedValue,$adminabc)";
            $db->setQuery($query);
            $result = $db->execute();

            $db = JFactory::getDbo();
            $query_user = $db->getQuery(true);
            $query_user = "INSERT INTO joom_fss_files (user_id,admin_id,file_type,file_name,path_url) VALUES ($selectedValue,$adminabc,'$imageFileType','$imageFileName', '$target_file')";
            $db->setQuery($query_user);
            $result = $db->execute();
            sweetAlert("You have successfuly uploaded a file."); 
        }

    } else {
        echo "Sorry, there was an error uploading your file.";
    }
}

?>
这是我的jquery脚本
<script src="http://malsup.github.com/jquery.form.js"></script> 
<script src="http://malsup.github.com/jquery.form.js"></script>
<script>
  jQuery(document).ready(function() { 
            jQuery('#test_ajax').ajaxForm(function() { 
                e.preventDefault();
            }); 
  });
 </script>

我认为你应该用这种方式,响应是你在。php页面中回声的一切。

$("#test_ajax").ajaxForm({
    success: function(response, textStatus, xhr, form) {
        alert(response); //alert
        $('#some-container').html(response); //show in html element
    },
    error: function(xhr, textStatus, errorThrown) {
        console.log("in ajaxForm error");
    },
    complete: function(xhr, textStatus) {
        console.log("in ajaxForm complete");
    }
});