ajax - MVC.NET, JQuery - How to submit a form that is made up of a JQuery datatable with rows that contain checkboxes and text inputs? -
i have jquery datatable has multiple rows contain checkboxes , text input fields. object select rows have checkboxes checked , submit them via ajax. able "id" attribute of checkboxes checked, how values (labels , text inputs) of columns in rest of row?
i need post these action via ajax call. how should go doing , how catch these values in post action?
i have student model.
public class student { public string studentid { get; set; } public string firstname { get; set; } public string lastname { get; set; } }
the view bound model (@model project.models.ienumerable<student>
) , datatable generated following:
<table> <thead> <tr> <td>select</td> <td>studentid</td> <td>firstname</td> <td>lastname</td> </tr> </thead> <tbody> <tr> foreach (var student in model) { <td><input type="checkbox" id="@student.studentid"/></td> <td>@student.studentid</td> <td>@student.firstname</td> <td><input type="text" value="@student.lastname"/></td> } </tr> <tbody> </table>
the last name field editable, , rows have checkbox checked should updated in database.
so when submit form, in post action, this?
[httppost] public actionresult updatestudent(ienumerable<student> students) { }
i have tried above method, have not had success. suggestions?
you cannot use foreach
loop because generates duplicate name
attributes without indexers , therefore can't bound collection (it generates invalid html because of duplicate id
attributes). must use either for
loop , make model ilist<student>
or custom editortemplate
typeof student
.
since unchecked checkboxes not post value, textboxes will, need start creating view model (say) bool isselected
property can bind using @html.checkboxfor()
, ensure value posted matches corresponding textbox.
public class studentvm { public string id { get; set; } public string firstname { get; set; } public string lastname { get; set; } public bool isselected { get; set; } }
then in view
@model list<yourassembly.studentvm> @using (html.beginform()) { <table> .... <tbody> for(int = 0; < model.count; i++) { <tr> <td>@html.checkboxfor(m => m[i].isselected)</td> <td> @html.hiddenfor(m => m[i].id) @html.displayfor(m => m[i].id) </td> .... <td>@html.textboxfor(m => m[i].lastname)</td> </tr> } </tbody> </table> <input type="submit" ... /> }
and controller methods might like
public actionresult updatestudent() { list<studentvm> model = db.students.select(s => new studentvm { id = s.studentid, firstname = s.firstname, lastname = s.lastname }); return view(model); } [httppost] public actionresult updatestudent(list<studentvm> model) { var selectedstudents = model.where(s => s.isselected); // save , redirect }
Comments
Post a Comment