We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Dear Prasanna Kumar,
Please find the attached my project.
In the project am able to assign the data to drop down(table1-States), and grid(table2-Cities).
Based on drop down value i want to change grid data. table 1 and table 2 relation with primary key and foreigen keys.
i used code first approach .
Regards,
J.Sateesh Kumar
|
@Html.EJ().DropDownList("States").Datasource((IEnumerable<object>)ViewBag.state).DropDownListFields(df => df.Text("text")).Width("400").ClientSideEvents(eve => eve.Change("drpvaluechange"))
@(Html.EJ().Grid<object>("Flat")
. . . . . . .
}))
<script>
function drpvaluechange(args) {
$.ajax({
url: "/Grid/Dropdown",
type: "POST",
dataType: "json",
data: { "country": args.text },
success: function (data) {
var grid = $("#Flat").ejGrid("instance");
grid.dataSource(data);
}
});
}
</script>
|
Dear Vignesh,
Thank you Vignesh for your help.
using java script able to call the controller and getting the filter data. but m not able to refresh the grid with new data.
In view-
@Html.EJ().DropDownList("StateId").Datasource((IEnumerable<object>)ViewBag.StateDs).DropDownListFields(df => df.Text("StateName").Value("StateId")).Width("200").ClientSideEvents(eve => eve.Change("drpvaluechange"))
@(Html.EJ().Grid<object>("Flat")
.Datasource((IEnumerable<object>)ViewBag.CityDs)
.EditSettings(edit => { edit.AllowAdding().AllowDeleting().AllowEditing(); })
.AllowSorting().AllowPaging().PageSettings(page=>page.PageSize(5)).IsResponsive()
.ToolbarSettings(toolbar =>
{
toolbar.ShowToolbar().ToolbarItems(items =>
{
items.AddTool(ToolBarItems.Add);
items.AddTool(ToolBarItems.Edit);
items.AddTool(ToolBarItems.Delete);
items.AddTool(ToolBarItems.Update);
items.AddTool(ToolBarItems.Cancel);
});
}).Columns(col =>
{
col.Field("CityId").HeaderText("CityId").IsPrimaryKey(true).TextAlign(TextAlign.Left).Width("8%").AllowEditing().Add();
col.Field("StateId").HeaderText("StateId").TextAlign(TextAlign.Left).Priority(4).Width("15%").AllowEditing().Add();
col.Field("CityName").HeaderText("CityName").Width("15%").AllowEditing().Add();
col.Field("CityState").HeaderText("CityState").TextAlign(TextAlign.Left).Priority(4).Width("15%").AllowEditing().Add();
}))
function drpvaluechange(args) {
debugger;
$.ajax({
url: "/School/GetCities",
type: "POST",
dataType: "json",
data: { "StateId": args.selectedValue },
success: function (data) {
var grid = $("#Flat").ejGrid("instance");
grid.dataSource(data1);
},
error: function () {
alert('error');
}
});
}
Regards
J. Sateesh Kumar
|
function drpvaluechange(args) {
debugger;
$.ajax({
url: "/School/GetCities",
type: "POST",
dataType: "json",
data: { "StateId": args.selectedValue },
success: function (data) {
var grid = $("#Flat").ejGrid("instance");
grid.dataSource(data1);
},
error: function () {
alert('error');
}
});
}
|
|
success: function (data) {
var grid = $("#Flat").ejGrid("instance");
grid.dataSource(data);
},
|
Dear Vignesh,
am using visual studio 2013. for this project we are using .netframework 4.5
please find the attached files.
Thansk for advance,
J Sateesh Kumar
|
function drpvaluechange(args) {
$.ajax({
url: "/Grid/Dropdown",
type: "POST",
dataType: "json",
data: { "country": args.text },
success: function (data) {
var grid = $("#Flat").ejGrid("instance");
grid.dataSource(data);
}
});
} |
|
public ActionResult Dropdown(string country)
{
var employeeID = OrderRepository.GetAllRecords().Where(c => c.ShipCountry == country).ToList();
return Json(employeeID, JsonRequestBehavior.AllowGet);
} |
Hi Vignesh,
as you said am passed the json from the controller only. but still am not able to refresh the grid with new data.
Note: Initially my ej grid load the all the cities . now am trying to change the grid when user select any one from the drop down.
Regards,
J. Sateesh Kumar
