How to know the selected rows in WebGrid

Question

My requirement is: To show data in grid and also able to select few rows from there. Once user selects rows then can press a button to process the selected row data.

To achieve this, I added an extra column i.e. a check box in the WebGrid as follows: grid.column("MyColumn",format:@<text><input type="checkbox" name="Select"></text>)

But problem is, how can I know which rows are selected on button press? I think, I should add some event handler on the check box and will save those selected check row in some variable and send those rows data on button press event.

Added the snapshot of the WebContenet, where I want to process the selected row on button click.

Please do let me know if this correct and can be done in the MVC or suggest me any alternative way.

Answer 1

Following tips from this article Get Checked Rows In a Webgrid Using Checkbox MVC3, you could try the following:

Wrap the div containing WebGrid inside a form to be submited

@using (Html.BeginForm("Assign","Home"))
{
  <div id="grid">
     @grid.GetHtml(
         tableStyle: "grid",
         headerStyle: "head",
         alternatingRowStyle: "webgrid-alternating-row",
         columns: grid.Columns(grid.Column(header: "Assign?", format:@<text><input class="check-box"  id="assignChkBx"name="assignChkBx" type="checkbox" value="@item.Id"/></text>)))
  </div>     
  <p><input type ="submit" value ="Submit" /></p>
}

Assuming it is as above, define a controller to get the checkbox values selected rows from webgrid

[HttpPost]  
public ActionResult Assign(FormCollection form)
{   
    //get collection of selected ids
    var chckedValues = form.GetValues("assignChkBx");

    //You can use each object if u wish from id
    foreach (var id in chckedValues)
    {
       //get object example..  Customer Customer = Customers.find(id);
       //Your Method here like send an item to customer
    }
    return RedirectToAction("index");
}