0

ここに PHP/Ajax の初心者がいます...テキストエリアの内容を Ajax 経由で MySQL に保存しようとしています。データは正しく保存されていますが、Ajax はまったく機能していません。基本的に、Ajax とは異なり、データが保存された後にページが "再読み込み/更新" されます。私が間違っていることを教えてください。

index.html:

<form action="save.php" method="post" id="source-form">
<span><input type="submit" value="Save" /></span>
<div>
<textarea id="editor" name="editor" >

</textarea>
</div>
</form>

JavaScript:

 $(document).ready(function() {

    $("#source-form").submit(function(){
    $.ajax({
        url:"save.php",
        type:"post",
        data:$(this).serialize(),
        success: alert('saved');
    });
});

save.php

<?php

// connect to the database
include('connect-db.php'); 

// get form data, making sure it is valid
$submit_date = date('Y-m-d H:i:s');
$content = mysql_real_escape_string(htmlspecialchars($_POST['editor']));

//build query
mysql_query("INSERT source SET submit_date='$submit_date',content='$content'")
or die(mysql_error());

header('Location: index.html');

?>

これに関するヘルプをいただければ幸いです。ありがとうございました。

編集： 同じ問題または類似の問題に遭遇した人々のために...ここに素晴らしい解決策があります： http://jquery.malsup.com/form/#getting-started

4

4 に答える 4

1

あなたを変える<form action="save.php" method="post" id="source-form">

に<form method="post" id="source-form">

ajaxでURLをすでに宣言したアクションを削除します

ajaxを使用しているためリダイレクトしないため、削除header('Location: index.html');してください。ajaxを使用している場合は、ページを更新する必要はなく、結果が成功したという確認を受け取るだけであることを覚えておいてください

于 2012-07-25T03:57:49.650 に答える
0

return false;フォームの送信がキャンセルされるように、フォーラムの送信にを追加します。

$("#source-form").submit(function(){
    $.ajax({
        url:"save.php",
        type:"post",
        data:$(this).serialize(),
        success: alert('saved');
    });

    return false;
});
于 2012-07-25T03:39:33.743 に答える
0

送信ボタンのデフォルトの動作（フォームの投稿）を停止する必要があります。そうしないと、フォームが再度送信され、ページが再度読み込まれるのがわかります。preventDefault関数を使用します

$("#source-form").submit(function(e){
     e.preventDefault();
     $.ajax({
        url:"save.php",
        type:"post",
        data:$(this).serialize(),
        success: alert('saved');
     });
 });
于 2012-07-25T03:40:22.980 に答える
0

フォームを ajax 送信のみに使用している場合は、フォームを HTML から完全に削除し、クリック イベントを使用することをお勧めします。HTML の内容を最小限に抑えました。

HTML

<input id="save-text" type="submit" value="Save" />
<textarea id="editor" name="editor" ></textarea>

JavaScript

$(document).ready(function() {

    $("#save-text").click(function(){
    $.ajax({
        url:"save.php",
        type:"post",
        data: $("#editor").serialize(),
        success: alert('saved');
    });
});
于 2012-07-25T03:58:02.910 に答える