Feb 21, 2013, 3:29 AM
Posting Ext.Net Gridpanel changed rows with mvc form
I am new in Ext.Net, I am using gridpanel inside mvc form, it is editable gridpanel. I want to post data in gridpanel to the controller along with form's other elements and read gridpanel from controller, validate with my rules and save data manually. Please help me how to post gridpanel data to controller and read all data from controller.
I am using view as as:
Thanks
I am using view as as:
@using (Html.BeginForm("Create", "Leave", FormMethod.Post, new { id = "myForm" }))
{
@Html.ValidationSummary(true)
<div class="module_content">
<fieldset>
<legend></legend>
@Html.Hidden("grdData")
<div class="editor-label">
@Html.LabelFor(model => model.RequestForDateFrom)
</div>
<div class="editor-field">
@Html.X().DateFieldFor(model => model.RequestForDateFrom).HideLabel(true).Format("dd MMM yyyy")
@Html.ValidationMessageFor(model => model.RequestForDateFrom)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.RequestForDateTo)
</div>
<div class="editor-field">
@Html.X().DateFieldFor(model => model.RequestForDateTo).HideLabel(true).Format("dd MMM yyyy")
@Html.ValidationMessageFor(model => model.RequestForDateTo)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.EmpCode)
</div>
<div class="editor-field">
@Html.DropDownList("EmpCode")
@Html.ValidationMessageFor(model => model.EmpCode)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.RequestDescription)
</div>
<div class="editor-field">
@Html.TextAreaFor(model => model.RequestDescription, new { @class = "cleditor" })
@Html.ValidationMessageFor(model => model.RequestDescription)
</div>
<div class="clear"></div>
<br />
<div class="editor-label">
@Html.LabelFor(model => model.RequestStatus)
</div>
<div class="editor-field">
@Html.DropDownList("RequestStatus")
@Html.ValidationMessageFor(model => model.RequestStatus)
</div>
<br />
@(
Html.X().GridPanel()
.Title("Leave Request Details")
.ID("gvLeaveDetails")
.EnableColumnHide(false)
.SortableColumns(false)
.ColumnLines(true)
.Width(700)
.SelectionModel(Html.X().CellSelectionModel())
.Store(Html.X().Store()
.AutoLoad(true)
.RemoteSort(false)
.IsPagingStore(false)
.RemotePaging(false)
.Proxy(Html.X().AjaxProxy()
.Url(Url.Action("LoadLeave"))
.Reader(Html.X().JsonReader()
.Root("data")
.IDProperty("LeaveCode")
))
.Model(Html.X().Model()
.Fields(fields =>
{
fields.Add(Html.X().ModelField().Name("IsSelected"));
fields.Add(Html.X().ModelField().Name("LeaveCode"));
fields.Add(Html.X().ModelField().Name("LeaveName"));
fields.Add(Html.X().ModelField().Name("RequestForDateFrom"));
fields.Add(Html.X().ModelField().Name("RequestForDateTo"));
fields.Add(Html.X().ModelField().Name("LeaveType"));
fields.Add(Html.X().ModelField().Name("LeaveDays"));
}
))
)
.ColumnModel(
Html.X().CheckColumn()
.DataIndex("IsSelected")
.Text("Select")
.Editable(true)
.Width(40),
Html.X().Column()
.DataIndex("LeaveCode")
.Text("Leave Code")
.Width(70)
.Hidden(true),
Html.X().Column()
.DataIndex("LeaveName")
.Text("LeaveName")
.Width(220),
Html.X().Column()
.DataIndex("CurrentLeaveBalance")
.Text("Leave Balance")
.Width(90),
Html.X().DateColumn()
.DataIndex("RequestForDateFrom")
.Text("Date From")
.Width(100)
.Format("dd MMM yyyy")
.Editor(Html.X().DateField()),
Html.X().DateColumn()
.DataIndex("RequestForDateTo")
.Text("Date To")
.Width(100)
.Format("dd MMM yyyy")
.Editor(Html.X().DateField()),
Html.X().Column()
.DataIndex("LeaveType")
.Text("LeaveType")
.Width(100)
.Editor(Html.X().ComboBox()
.TypeAhead(true)
.SelectOnTab(true)
.Items(
"Full Leave",
"Half Leave"
)
),
Html.X().Column()
.DataIndex("LeaveDays")
.Text("Days")
.Width(50)
)
.Plugins(
Html.X().CellEditing()
.ClicksToEdit(2)
.Listeners(ls => ls.Edit.Handler = "onEdit(item, e)")
)
)
</fieldset>
</div>
<footer>
<div class="submit_link">
<input type="submit" class="btn btn-primary" value="Save Request" >
@Html.ActionLink("Cancel", "Index", new { }, new { @class = "btn btn-primary" })
</div>
</footer>
}
Thanks