@(Html.EJ().Grid<object>("FlatGrid")
.ClientSideEvents(ce=> { ce.ActionComplete("complete"); })
.AllowPaging() /*Paging Enabled*/
.EditSettings(edit => { edit.AllowAdding().AllowDeleting().AllowEditing(); })
.ToolbarSettings(toolbar =>
{
--------------
})
.Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(75).Add();
col.Field("EmployeeID").HeaderText("Employee ID").EditType(EditingType.Numeric).TextAlign(TextAlign.Right).Width(75).Add();
col.Field("Freight").HeaderText("Freight").EditType(EditingType.Numeric).TextAlign(TextAlign.Right).
Width(75).Format("{0:C}").Add();
}))
</div>
<script type="text/javascript">
function complete(args) {
debugger
if (args.requestType == "beginedit" || args.requestType == "add" ) {
$("#FlatGridEmployeeID").ejNumericTextbox({ value: $("#FlatGridEmployeeID").val(),
change: "Numerichange" }); // Bind the change event for the EmployeeID column numeric text box
$("#FlatGridFreight").ejNumericTextbox({ value: $("#FlatGridFreight").val(),
change: "CurrencyChange" }); // Bind the change event for the freight column numeric text box
}
}
function CurrencyChange(args) {
var freight = $("#FlatGridFreight").val(); // get the changed freight column value
var total = freight / 50; // calculation for the EmployeeID column value
$("#FlatGridEmployeeID").ejNumericTextbox({value: total}); // Change the EmployeeID column valuw according to the Freight value changed
}
function Numerichange(args) {
var employeeID = $("#FlatGridEmployeeID").val(); // get the changed freight column value
var total = employeeID * 50; // calculation for the freight column value
$("#FlatGridFreight").ejNumericTextbox({ value: total }); // Change the freight column valuw according to the EmployeeID value changed
}
</script>
|