JavaScript jQuery Ajax Problem: POST works fine in Firefox, IE, Safari, but not in Chrome

I am new to JavaScript and working on a hobby project with several developers. We have a simple page that is used to send queries to the database.

I decided to try learning jQuery and started to implement some AJAX features on this query page. It works fine in FireFox, IE, and Safari, but for some odd reason, I can't get it to work in Chrome.

I have been debugging it for a couple of hours, and I have no idea why it is not working. Here's the relevant part of the HTML form (post action removed due to JavaScript):

        <form method="POST">
            <input type="text" name="amount" value="0" size="7" />
            <input type="submit" value="Fulfill!" /><br />
            <input type="hidden" name="index" value="69" />
            <input type="hidden" name="item" value="Iron Ore" />
        </form>

And here is the PHP form it sends to:

<?php
require_once("../classes/Database.php");
$database = new Database();

$amount = $database->sanitizeString($_POST['amount']);
$index = $database->sanitizeString($_POST['index']);
$username = $database->sanitizeString($_POST['username']);
$item =  $database->sanitizeString($_POST['item']);
$database->connect();
$database->setRequest($amount, $index, $username, $item);
$database->setKarma($username, $amount, $item);
?>

And most importantly, here is my newbie JavaScript code, which is just in the HTML file:

<script language="JavaScript">
    var amount = 0;
    var index = 0;
    var item = 0;
    var username = "";
    var data = "";
    $(document).ready(function(){
        $("form input[type=submit]").click(function(){
            amount = $(this).siblings("input[name=amount]").val();
            index = $(this).siblings("input[name=index]").val();
            item = $(this).siblings("input[name=item]").val();
            username = "<?=$_SESSION['username']; ?>";
            //var stuff = $.post("pages/ajaxfulfill.php", {amount:amount,index:index,item:item, username:username}, function(data){alert(data)}, "html");
            var stuff = $.ajax(
                                    {
                                        url: "pages/ajaxfulfill.php",
                                        type: "POST", data:"amount=" + amount + "&index=" + index + "&item=" + item + "&username=" + username,
                                        success: function(data)
                                        {
                                            alert("Success")
                                        },
                                        error: function (XMLHttpRequest, textStatus, errorThrown)
                                        {
                                            alert("error" + XMLHttpRequest.status);
                                            alert("error" + XMLHttpRequest.responseText);
                                        }
                                    }
                               )
            $(this).parents("td").text("Submitted");

        });

    });

</script>

$.post, . $.ajax , FF, IE Safari "", Chrome 0 .

JavaScript, , . - , . .

+3
4

, . - , , XMLHttpRequest.

( -, , , text(). ? .. , .)

event.preventDefault(); , function(event) { ... }, , .

. script ( ) , , Enter. AJAX- submit form. event.preventDefault(); - .

action <form>; URL . , ( ), <form>. : HTML method="POST" action="ajaxfulfill.php", AJAX .

username = "<?=$_SESSION['username']; ?>";

Script . :

username= <?= json_encode($_SESSION['username'], JSON_HEX_TAG); ?>

data:"amount=" + amount + "&index=" + index + "&item=" + item + "&username=" + username,

encodeURIComponent(...) URL--, . jQuery :

data: {amount: amount, index: index, item: item, username: username},

, field.val() serialize, :

data: $(this).serialize(),

(, this form onsubmit ... , $(this.form).)

POST-, ? , , , .

+4

, , . Chrome v4.0.249.27 ( , OS X) , , , . , Chrome, . ".ajax" " " "" .

& raquo; & raquo; .

+2

, :

  • Shift + Ctrl + J Chrome, Javascript . .
  • / Javascript ( )
+1

, , , , .

, Chrome , . , js, css Safari Firefox , Chrome , .

, , , .

0

Source: https://habr.com/ru/post/1725009/


All Articles