javascript - 呼び出されたときにajaxリクエスト関数が機能しない

原文 javascript php ajax prototype ajax.request

  <script type="text/javascript"src="prototype.js"></script>
<script type="text/javascript">
//<![CDATA[
document.observe("dom:loaded", function() {

    function sendRequest() {

        var oform = document.forms[0];
        var sBody = getRequestBody(oform);

        var oOptions = {
            method: "post",
            parameters: sBody,
            onSuccess: function (oXHR, oJson) {
                saveResult(oXHR.responseText);
            },
            onFailure: function (oXHR, oJson) {
                saveResult("An error occurred: " + oXHR.statusText);
            }
        };

        var oRequest = new Ajax.Request("edit_status.php", oOptions);      
    }

    function saveResult(sMessage) {
        var divStatus = document.getElementById("divStatus");
        divStatus.innerHTML = "Request completed: " + sMessage;            
    }


    });
//]]>
</script>


私はajaxが初めてです。私は手元にプロジェクトがあり、本当に多くのajax機能が必要です。私は私が買った本からこの上のコードに従っています。このコードをローカルサーバーにコピーすると、送信ボタンをクリックしてもajax.request関数が機能しません。 PHPページに直接移動します。誰かがこれを見るのを手伝ってくれませんか?

**

<form method="post" action="SaveCustomer.php" 
      onsubmit="sendRequest(); return false">
<p>Enter customer information to be saved:</p>
<p>Customer Name: <input type="text" name="txtName" value="" /><br />
Address: <input type="text" name="txtAddress" value="" /><br />
City: <input type="text" name="txtCity" value="" /><br />
State: <input type="text" name="txtState" value="" /><br />
Zip Code: <input type="text" name="txtZipCode" value="" /><br />
Phone: <input type="text" name="txtPhone" value="" /><br />
E-mail: <input type="text" name="txtEmail" value="" /></p>




</form>
<div id="divStatus"></div>


**

**


header("Content-Type: text/plain");

//get information
$sName = $_POST["txtName"];
$sAddress = $_POST["txtAddress"];
$sCity = $_POST["txtCity"];
$sState = $_POST["txtState"];
$sZipCode = $_POST["txtZipCode"];
$sPhone = $_POST["txtPhone"];
$sEmail = $_POST["txtEmail"];

//status message
$sStatus = "";

//database information
$sDBServer = "localhost";
$sDBName = "ajax";
$sDBUsername = "root";
$sDBPassword = "";


//create the SQL query string
$sSQL = "Insert into Customers(Name,Address,City,State,Zip,Phone,`Email`) ".
          " values ('$sName','$sAddress','$sCity','$sState', '$sZipCode'".
          ", '$sPhone', '$sEmail')";

$oLink = mysql_connect($sDBServer,$sDBUsername,$sDBPassword);
@mysql_select_db($sDBName) or $sStatus = "Unable to open database";

if ($sStatus == "") {
    if(mysql_query($sSQL)) {
        $sStatus = "Added customer; customer ID is ".mysql_insert_id();
     } else {
        $sStatus = "An error occurred while inserting; customer not saved.";
    }
}
mysql_close($oLink);

echo $sStatus;


?>
**
答え
あなたはajaxを発射していません私はあなたがオプションを定義しているのを見ますがそれはそれを試みます
jqueryを使用すると、フォームの送信を待つことができます

$('your form').on('submit', function(event){
    event.preventDefault();
    $.ajax({
        url:'your url',
        type:'post',
        data:'your data',
        success:function(data, jxhr){
            //your success function
        },
        error:function(){}
    });
});


e.preventDefault()は、同期送信がデフォルトのメソッドを起動しないようにします

コードを見ると、sendRequest()をsendRequest(event)に変更して、event.preventDefaultを追加できます。常にfalseを返すという問題があります
関連記事

javascript - Chromeで更新後ドロップダウン値が変更されるが、Firefoxでは変更されない

javascript - 非表示のフォームフィールドに挿入されたJavascriptから生成された値が必要

javascript - .trigger();を使用した複数のキー押下のシミュレーション

javascript - ワイヤーフレームの対角線を削除するには?

javascript - Ajax応答を使用してテーブルを書き換える方法

javascript - AJAXは前の値を配列で返します

javascript - Webサイト外でのAPI呼び出しを防ぐ方法[重複]

javascript - QML / JavascriptからAmazon AWSサービスにアクセスする

javascript - カスケードされた選択ボックスでデータベースからデータをフェッチする

javascript - mouseenterでのポップオーバー遅延表示(Angularjs)