2012-12-04 15 views
5

ActionLinkを使用して動作するように選択されたチェックボックスのリストを取得する方法を試しています。私はJavaScriptを使って何かのクライアントをする必要があると思いますが、関連するコードを見つけることはできません。選択したチェックボックスのリストをビューからコントローラに送信する方法

次のコードは、送信ボタンを使用して完全に動作し、選択したIDをIDの配列としてポストバックしますが、他のボタンがあるページでこれを設定する必要があります。

// the view 
@foreach (var station in Stations) 
{ 
    <input type="checkbox" name="selected" value="@station.StationId" /> 
}  
<input type="submit" value="Save" /> 

//Controller stub 
public ActionResult Action(string [] selected) 

私は時間のために、この上で立ち往生されているので、多分私はこれで間違った方法を探しています。

PS。私の最初のポストは、ここで多くの時間を読んで学びました。

<div id="MyDiv"> 
    @foreach (var station in Stations) 
    { 
     <input type="checkbox" name="selected" value="@station.StationId" /> 
    } 
</div> 

スクリプト:

$(document).ready(function() { 
    $('#someButton').click(function() { 
     var list = []; 
     $('#MyDiv input:checked').each(function() { 
      list.push(this.name); 
     }); 
     // now names contains all of the names of checked checkboxes 
     // do something with it for excamle post with ajax 
     $.ajax({ 
      url: '@Url.Action("Action","Contoller")', 
      type: 'POST', 
      data: { Parameters: list}, 
      success: function (result) { 
       alert("success")! 
      }, 
      error: function (result) { 
       alert("error!"); 
      } 
     }); //end ajax 
    }); 
}); 

ControllのCheckBoxListを投稿する

+2

あなたはリンクをクリックしてサーバーにコンテンツの投稿を取得できますか?これらのチェックボックスはフォーム内にあると仮定できますか? Ajax投稿ですか? – Jack

+0

はい、リンクをクリックするだけです。私は私のビュー(PartialView)でフォームを使用していないが、@ Html.FormBegin()を使用して、送信ボタンを互いに区別することができることを認識している。私はAjaxやJavaScriptに慣れていないので、私はここで苦労しています。 – tr3v

答えて

2

を得た場合は、AJAXのポストを探してされていないように見えます。これに取り組む最も簡単な方法は、フォームにそれをラップし、submit関数を呼び出すことです。あなたのコードは次のようになります:

@using(Html.BeginForm("uraction", "urcontroller", FormMethod.Post, new { id = "formId" })) { 
    foreach(var station in Stations) { 
     <input type="checkbox" name="selected" value="@station.StationId" /> 
    } 
} 
<a href="#" id="postBtn">Post</a> 
<script> 
    $(document).ready(function() { 
     $('#postBtn').click(function() { 
      $('#formId').submit(); 
     } 
    } 
</script> 
+0

これは(@AliRıza-Adıyahşiの投稿と同様に)私が望むように見えますが、私は既存のJavaScriptと競合しているようです。私のコードは、クライアント側のページングを持ち、上記のスクリプトを入力することで私のページングを壊すPartialViewにあります。私はスクリプトを管理するためのベストプラクティスを読んで、簡単なページから始めましょう。 – tr3v

+0

通常、AJAXポストでは、サーバーから何らかのフィードバックを取得し、そのデータをページに戻したり、ユーザーに変更があったことを知らせたりしたいとします。私はちょうどあなたが別のページにユーザーをリダイレクトして、データの処理を検討していると推測しています。そうであれば、私のソリューションはより適しています。 – Jack

+0

あなたは正しいと思います。私はオブジェクトのリストを持っています(ページングされていますが、この段階で一度に1ページしか扱わず、前のページからの選択を覚える必要はありません)。オブジェクトを選択し、選択したオブジェクトを処理するアクションを呼び出すことができます:削除、フラグなど...返信ありがとうございます。 – tr3v

3

SomeButtonsやリンクが

<a href="#" id="someButton">Post</a> 
//or buttons, helpers and any elements to trigger ajax post... 

CheckBoxListの値ER:

public ActionResult Action(string [] Parameters) 

私はそれを右:)

関連する問題