いくつかのパラメーターを使用してフォーム送信 (POST) を実行しようとしていますが、データテーブルに入力したいパラメーターに基づいています。しかし、私は Javascript (私の言語は Java) があまり得意ではないので、Ajax 呼び出しでそれをやろうとしています。しかし、それは私にはうまくいきません。サーブレットへのパラメーターを使用して POST を実行することを除いて、すべてがうまくいきます。データテーブルは常に自動的に入力されますが、フォームの送信後に入力する必要があります。
誰かが私のケースの例を知っていますか? ここでフォームの投稿とチュートリアルをたくさん読みましたが、このケース (?) はありません。
私のコードは次のようになりました。これは私にとってはうまくいきます。このテーブルで並べ替えや検索を行うことはできません。何が欠けている?
ありがとうございました。
<script type="text/javascript" language="javascript" src="/global/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" language="javascript" src="/global/js/jquery.dataTables.min.js"></script>
<form name="myform" id="myform" action="" method="POST">
<label for="season">Season:</label>
<input type="text" name="season" id="season" value=""/> <br />
<label for="type">Type:</label>
<input type="text" name="type" id="type" value=""/> <br/>
<input type="button" id="btnSubmit" name="btnSubmit" value="Search">
</form>
<table class="display" id="example">
<thead>
<tr>
<th>Name</th>
<th>NationId</th>
<th>RegionId</th>
<th>Attendance</th>
</tr>
</thead>
<tbody>
<!-- data goes here -->
</tbody>
</table>
<script>
$("#btnSubmit").click( function() {
var formData = "season=" + $("input#season").val() + "&type=" + $("input#type").val();
$('#example').dataTable( {
"bJQueryUI": true,
"bProcessing": true,
"bDestroy": true,
"sAjaxSource": "/servlets/service/competitions/",
"fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
oSettings.jqXHR = ${esc.d}.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": formData,
"success": fnCallback
} );
}
} );
} );
</script>