オブジェクトのコレクションを追加、編集、削除するためのページを作成したいと思います。javascriptで追加/編集/削除操作をしたい。現在、次のHTMLがあります。
<table class="table table-striped">
<thead>
<tr>
<td>Name</td>
<td>Number</td>
<td>Country</td>
<td></td>
</tr>
</thead>
<tbody>
@foreach(var n in Model)
{
<tr>
<td class="name">@n.Name</td>
<td class="value">@n.Value</td>
<td class="country-name">@n.CountryName</td>
<td><ahref="#">Edit</a> | <a href="#">Delete</a></td>
</tr>
}
</tbody>
</table>
<div class="modal">
<form>
<label>Name</label>
<input type="text" />
<label>Value</label>
<input type="text />
<button type="submit">Save</button>
</form>
</div>
ユーザーが「編集」を押すと、JavaScriptコードがmodal
divに関連データを入力し、画面に表示します。ユーザーが[送信]を押すと、データはajaxで送信され、モーダルダイアログは非表示になり、テーブルは新しいデータで更新されます。
送信する前にフォームを検証したいのですが。可能であれば、目立たないクライアント検証システムを利用して、モデルクラスのデータアノテーションへの変更がクライアント側のコードに自動的に反映されるようにしたいと思います。より標準的な例では、@Html.EditorFor()
メソッドを使用して正しいHTMLを生成できますが、ここではこれは不可能です。
目立たない検証は、次のようにhtml要素の属性を使用して制御されます。
<input data-val="true" data-val-required="This field is required." id="Name"
name="Name" type="text">
<span class="field-validation-valid" data-valmsg-for="Name"
data-valmsg-replace="true"></span>
クラスの特定のインスタンスを参照せずに、特定のモデルクラスに関連するHTMLを生成することは可能ですか?または、他に使用できる方法はありますか?