asp.net mvc - Issue regarding posting data to controller using jquery $.post -
i have 2 dropdown 1 country , 1 state. when first time form render country dropdown populated , state dropdown disable. when user select country partial post occur jquery , controller action method called return json data. problem occur when user select country saw overloaded index method called , return json firebug showing error network error.
here giving controller code , cshtml code. please tell me wrong there
cshtml code @{ viewbag.title = "home page"; } <script src="@url.content("~/scripts/jquery-1.5.1.min.js")" type="text/jscript"></script> <script type="text/jscript"> $(function () { // $('#countryid').change(function () { // var url = $('#formid'); // alert(url); //// $.getjson('/ddl/districtlist/' + $('#state').val(), function (data) { // }); // }); $('#countryid').change(function () { var dropdownid = $(this).val(); $.post('@url.action("index", "home")', { countryid: dropdownid }, function (result) { // result contains state-list var items = '<option>--select state--</option>'; $.each(data, function (i, state) { alert(i); items += "<option value='" + state.value + "'>" + state.text + "</option>"; }); $('#state').html(items); }); }); }); </script> @using (html.beginform()) { <fieldset> <legend>dropdownlist</legend> @html.label("country") @html.dropdownlist("country", viewbag.country selectlist, "--select country--", new { id = "countryid" }) @html.label("state") @html.dropdownlist("state", viewbag.country selectlist, "--select state--", new { id = "stateid", @disabled = "disabled" }) <input type="submit" value="create" id="submitid" /> </fieldset> } controller code using system; using system.collections.generic; using system.linq; using system.web; using system.web.mvc; namespace cascadetest.controllers { public class homecontroller : controller { public actionresult index() { viewbag.message = "welcome cascade test"; viewbag.country = new selectlist(cascadetest.models.country.getcountries(), "countryid", "name"); var state = s in cascadetest.models.state.getstate() s.countryid == "" select s.name; viewbag.state = new selectlist(state, "stateid", "name"); return view(); } [httppost] public jsonresult index(string countryid) { var state = s in cascadetest.models.state.getstate() s.countryid == countryid select s.name; string xxx = json(new selectlist(state.toarray(), "stateid", "name"), jsonrequestbehavior.allowget).tostring(); return json(new selectlist(state.toarray(), "stateid", "name"), jsonrequestbehavior.allowget); } } } model code using system; using system.collections.generic; using system.linq; using system.web; namespace cascadetest.models { public class country { public string countryid { get; set; } public string name { get; set; } public static iqueryable<country> getcountries() { return new list<country> { new country { countryid = "ca", name = "canada" }, new country{ countryid = "us", name = "united states" }, new country{ countryid = "uk", name = "united kingdom" }, new country{ countryid = "in", name = "india" } }.asqueryable(); } } public class state { public string stateid { get; set; } public string name { get; set; } public string countryid { get; set; } public static iqueryable<state> getstate() { return new list<state> { // state declare india new state { stateid = "wb", name = "west bengal" ,countryid="in" }, new state{ stateid = "bh", name = "bihar" ,countryid="in" }, new state{ stateid = "or", name = "orissa" ,countryid="in" }, new state{ stateid = "md", name = "madhya pradesh" ,countryid="in" }, // state declare usa new state{ stateid = "al", name = "alabama" ,countryid="us" }, new state{ stateid = "fl", name = "florida" ,countryid="us" }, new state{ stateid = "ia", name = "iowa" ,countryid="us" }, new state{ stateid = "ms", name = "mississippi" ,countryid="us" }, // state declare uk new state{ stateid = "av", name = "avon" ,countryid="uk" }, new state{ stateid = "bs", name = "buckinghamshire" ,countryid="uk" }, new state{ stateid = "ch", name = "cheshire" ,countryid="uk" }, new state{ stateid = "ds", name = "dorset" ,countryid="uk" } //no state define canada }.asqueryable(); } } } i think problem lies here in below code
$('#countryid').change(function () { var dropdownid = $(this).val(); $.post('@url.action("index", "home")', { countryid: dropdownid }, function (result) { // result contains state-list var items = '<option>--select state--</option>'; $.each(data, function (i, state) { alert(i); items += "<option value='" + state.value + "'>" + state.text + "</option>"; }); $('#state').html(items); }); }); here error line firefox showing
i not being able understand doing wrong. please me fix problem. thanks
how index method like
one default without argument , second index method called populate state when country selected. when country selected partial post occur jquery , second index method return json server side jquery parse populate state dropdown. please have @ code , tell me need change. thanks
public actionresult index() { viewbag.message = "welcome cascade test"; viewbag.country = new selectlist(cascadetest.models.country.getcountries(), "countryid", "name"); var state = s in cascadetest.models.state.getstate() s.countryid == "" select s.name; viewbag.state = new selectlist(state, "stateid", "name"); return view(); } [httppost] public jsonresult index(string countryid) { var state = s in cascadetest.models.state.getstate() s.countryid == countryid select s.name; string xxx = json(new selectlist(state.toarray(), "stateid", "name"), jsonrequestbehavior.allowget).tostring(); return json(new selectlist(state.toarray(), "stateid", "name"), jsonrequestbehavior.allowget); }
500 error code means runtime error generated in controller's action method. if inspect response in net tab of firebug, should tell error was.
off cuff, example, can see have no check determine if state returned query. potentially null, , if it's null you'll runtime errors effect of "null property doesn't have method" on place.
Comments
Post a Comment