asp.net mvc 3 ページに複数の動的ボタンがあります。asp.net mvc 3でボタンクリックを処理する最良の方法は何ですか? asp.net にはイベント処理がありません。
3 に答える
クリックイベントをサブスクライブすることにより、javascript を使用してボタンのクリックを処理できます。たとえば、jQuery を使用すると、これらのボタンにクラスを与えることができ、次のようになります。
$(function() {
$('.someClass').click(function() {
// a button was clicked, this will point to the actual button
});
});
または、それらがフォームの送信ボタンである場合は、それらに同じ名前と異なる値を付けてから、サーバーで name パラメータの値をテストできます。その値は、クリックされたボタンと同じになります。
たとえば、複数の送信ボタンがある次のフォームがあるとします。
@using (Html.BeginForm())
{
... some input fields
<button type="submit" name="Button" value="delete">Delete data</button>
<button type="submit" name="Button" value="save">Save data</button>
}
投稿先のコントローラーアクション内で、どのボタンがクリックされたかを判断できます。
[HttpPost]
public ActionResult Index(MyViewModel model)
{
var button = Request["button"];
if (button == "save")
{
// the save button was clicked
}
else if (button == "delete")
{
// the delete button was clicked
}
...
}
ボタンが何をしているかによって異なります。それらが論理的に個別のアクションである場合、サーバー側で個別のアクションへの各ポストバックを持つことができます。これは多くの場合、同じアクションのバリアントである保存とキャンセルでも機能します。たとえば、保存するとフォームがポストバックされ、キャンセルすると以前の URL にリダイレクトされます (たとえば、編集から詳細に戻る)。ボタンが同じアクションに戻される異なるデータを表している場合は、異なる値を与えることができます。ボタンに名前が付けられている場合、値はフォームに含まれていると仮定して、フォームの残りの部分と一緒に返されます。AJAX からポスト バックする場合は、フォームと共にボタンの値を明示的にシリアル化する必要がある場合があります。
保存・キャンセル例
@using (Html.BeginForm())
{
//...
<button type="submit" class="submit-button button">Save</button>
@Html.ActionLink( "Cancel", "details", new { ID = Model.ID }, new { @class = "cancel-button button" } )
}
次に、おそらく jQuery UI と組み合わせて CSS を使用し、ボタンのスタイルを設定します。
<script type="text/javascript">
$(function() {
$('.button').button();
...
});
</script>
If the buttons do not require the same form data, then you can create two forms with different action methods. This is the easiest solution.
If you need to use the same form data, then there are a number of methods, inclduing Darin and tvanfosson's approaches. There is also an approach based on attributes that will select the correct action method based on which button is clicked.