c# - sending values to url string on dropdown selected value change in asp.net MVC -
i have 2 tables. first development region , second zone. zone has got regionid foreign key. populate row zone table related region selected dropdown list. cannot figure out why value not being passed in url string. please me out , suggest best way accomplish it. below models, controllers , view.
model zone
public class zone { [key] public int zoneid { get; set; } [required] [display(name = "zone code")] [regularexpression(@"^[a-za-z]*$"), stringlength(5, errormessage = "code cannot more 5 charachter long")] [column("zcode")] public string zonecode { get; set; } [display(name ="zone"),regularexpression(@"^[a-z]+[a-z]*$"),required] public string zonename { get; set; } public int regionid { get; set; } public virtual devregion devregion { get; set; } [required] [display(name ="active")] public boolean isactive { get; set; } } model devregions
public class devregion { [key] public int regionid { get; set; } [required] [display(name = "code")] [regularexpression(@"^[a-za-z]*$"), stringlength(5, errormessage = "code cannot more 5 charachter long")] [column("rcode")] public string regioncode { get; set; } [required] [display(name ="region")] [column("rname")] [regularexpression(@"^[a-z]+[a-za-z\s-]*$", errormessage ="region can consist of alphabets, space , dash")] [stringlength(30,errormessage ="region cannot exceed 30 characters")] public string regionname { get; set; } [required] [display(name ="active")] public boolean isactive { get; set; } } zonescontroller
public class zonescontroller : controller { private huriscontext db = new huriscontext(); // get: zones public actionresult index(int? id) { viewbag.regionid = new selectlist(db.devregions, "regionid", "regionname"); var zones = db.zones.include(z => z.devregion).where(x=>x.regionid==(int)(id??x.regionid)); return view(zones.tolist()); } index.cshtml
@model ienumerable<huris.models.zone> .... <p>@html.actionlink("create new", "create")</p> @using (html.beginform("index","zones",formmethod.get)) { @html.antiforgerytoken(); <div class="panel panel-info"> <div class="panel-body"> <div class="form-group center-block"> <label for="regionid" class="control-label">region:</label> @html.dropdownlist("regionid", null, "show zones", htmlattributes: new { @class = "form-control", @onchange = "this.form.submit();" }) </div> </div> </div> } <table class="table"> <tr> <th>@html.displaynamefor(model => model.devregion.regionname)</th> <th>@html.displaynamefor(model => model.zonecode)</th> <th>@html.displaynamefor(model => model.zonename)</th> <th>@html.displaynamefor(model => model.isactive)</th> <th></th> </tr> @foreach (var item in model) { <tr> <td>@html.displayfor(modelitem => item.devregion.regionname</td> <td>@html.displayfor(modelitem => item.zonecode)</td> <td>@html.displayfor(modelitem => item.zonename)</td> <td>@html.displayfor(modelitem => item.isactive)</td> <td> @html.actionlink("edit", "edit", new { id = item.zoneid }) | @html.actionlink("details", "details", new { id = item.zoneid }) | @html.actionlink("delete", "delete", new { id = item.zoneid }) </td> </tr> } </table> jquery
$(document).ready(function () { $(".form-control").change(function () { $.ajax({ url: "~/zonescontroller/index", type: 'get', cache: false, data: { regionid: $(".form-control").val() }, success: function (data) { } }); }); });
index method shown below
public actionresult index() { viewbag.region = new selectlist(db.devregions, "regionid", "regionname"); var allzones = db.zones.include(z => z.devregion); return view(allzones.tolist()); } create new method shown below accept id selected on dropdown change event , create partial view load on list of data table depending on selected on dropdown:
public actionresult zonelist(int? id) { var zones = db.zones.include(z => z.devregion).where(x => x.regionid == (int)(id ?? x.regionid)); return partialview("~/views/partialviews/_zonelist.cshtml", zones.tolist()); } changed javascript follows.
$("#region").change(function () { var selectedid = $(this).val(); $.get('/zones/zonelist/' + selectedid, function (data) { $('.table').html(data); //$('.table').fadeout("linear"); //$('.table').fadein("linear"); }); }); }); on index.cshtml changed code follows:
@model ienumerable<huris.models.zone> @{ viewbag.title = "index"; } <h2>index</h2> <p> @html.actionlink("create new", "create") </p> @using (html.beginform()) { @html.antiforgerytoken(); <div class="panel panel-info"> <div class="panel-body"> <div class="form-group center-block"> <label for="regionid" class="control-label">region:</label> @html.dropdownlist("region", null, "show zones", htmlattributes: new { @class = "form-control"}) </div> </div> </div> } @{ html.renderpartial("~/views/partialviews/_zonelist.cshtml", model); } partial view _zonelist.cshtml
@model ienumerable<huris.models.zone> <table class="table"> <tr> <th> @html.displaynamefor(model => model.devregion.regionname) </th> <th> @html.displaynamefor(model => model.zonecode) </th> <th> @html.displaynamefor(model => model.zonename) </th> <th> @html.displaynamefor(model => model.isactive) </th> <th></th> </tr> @foreach (var item in model) { <tr> <td> @html.displayfor(modelitem => item.devregion.regionname) </td> <td> @html.displayfor(modelitem => item.zonecode) </td> <td> @html.displayfor(modelitem => item.zonename) </td> <td> @html.displayfor(modelitem => item.isactive) </td> <td> @html.actionlink("edit", "edit", new { id = item.zoneid }) | @html.actionlink("details", "details", new { id = item.zoneid }) | @html.actionlink("delete", "delete", new { id = item.zoneid }) </td> </tr> } 
Comments
Post a Comment