1

複数のレコードにまたがって大量のデータを保存するためのシリアル化されたフィールドを表示する単純な非Ajaxフォームがあります。つまり、複数のラインアイテムを含む見積もりであり、各ラインの各フィールドは編集可能です。

フォームは送信する前に保存する必要があります。フォームが編集されている場合はフォームの送信ボタンに[変更を保存](準コントローラーへのURLで実行)と表示し、編集していない場合は[クライアントに送信]と表示してください。

私はAJAXを調べていますが、この状況ではやり過ぎではないかと考えています。

どんな助けでも大歓迎です。

4

1 に答える 1

2

ボタンの文言を変更するだけなら、AJAXはやり過ぎです。[変更を保存]をクリックすると、通常どおりフォームが送信されます(その後、デフォルトの[クライアントに送信]でフォームが再度読み込まれますか?)、その必要はありません。

必要なのはプレーンなJavaScriptです。ボタンのテキストを変更するonchangeイベントハンドラーを各フィールドに関連付けます。また、フォームの他の側面(非表示の「data_changed」フィールドなど)を変更して、コントローラーがデータを送信する代わりに保存することを認識できるようにすることもできます。

変更が発生しない場合、ボタンは「クライアントに送信」のままになります。

私はこの答えに順調に進んでいますか?フォームを送信せずに「変更を保存」する必要がありますか?または、これを実現する方法の詳細を知りたいですか?

編集:サンプルコードが追加されました

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Save vs Submit Example</title>
<script type="text/javascript">

onchange_handler = function ( event ) {
    var form_modified = document.getElementById("form_modified");
    var form_submit = document.getElementById("form_submit");

    form_modified.value = "true";
    form_submit.value = "Save Changes";
}

</script>
</head>
<body>
<form method="post">

<input name="quote_number" type="text" onchange="onchange_handler()" />
<input name="quote_date" type="text" onchange="onchange_handler()" />


<input name="line_number" type="text" onchange="onchange_handler()" />
<input name="line_product" type="text" onchange="onchange_handler()" />
<input name="line_quantity" type="text" onchange="onchange_handler()" />

<input name="form_modified" id="form_modified" type="hidden" value="false" />
<input type="submit" id="form_submit" value="Submit to Client" />

</form>
</body>
</html>
于 2012-05-21T03:28:31.047 に答える