BoldSignA modern eSignature application with affordable pricing. Sign up today for unlimited document usage!
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