-1
こんにちは、次の点を参考にしてください。私はタウンが入っているドロップダウンリストを持っていますが、最初のドロップダウンで選択された町の郊外を取得するコントローラアクションがあるMVCプロジェクトを作成しましたが、コードが失敗しているようです。下記のコードを参照してください。カスケードDropDown JQuery
コントローラメソッド。ここで
public JsonResult GetSurburbs(string id)
{
List<SelectListItem> states = new List<SelectListItem>();
switch (id)
{
//Alberton surbubs
case "1":
states.Add(new SelectListItem { Text = "Select", Value = "0" });
states.Add(new SelectListItem { Text = "ALBERANTE", Value = "1" });
states.Add(new SelectListItem { Text = "ALBERTON", Value = "2" });
states.Add(new SelectListItem { Text = "ALBERTSDAL", Value = "3" });
states.Add(new SelectListItem { Text = "ALRODE", Value = "4" });
states.Add(new SelectListItem { Text = "ALRODE SOUTH", Value = "5" });
states.Add(new SelectListItem { Text = "ARTON", Value = "6" });
states.Add(new SelectListItem { Text = "BASSONIA ROCK", Value = "7" });
states.Add(new SelectListItem { Text = "BRACKENDOWNS", Value = "8" });
states.Add(new SelectListItem { Text = "BRACKENHURST", Value = "9" });
states.Add(new SelectListItem { Text = "EDEN PARK", Value = "10" });
states.Add(new SelectListItem { Text = "EDEN PARK WEST", Value = "11" });
states.Add(new SelectListItem { Text = "ELANDSFONTEIN 108-IR", Value = "12" });
states.Add(new SelectListItem { Text = "FLORENTIA", Value = "13" });
states.Add(new SelectListItem { Text = "GENERAAL ALBERTSPARK", Value = "14" });
states.Add(new SelectListItem { Text = "GREENFIELDS", Value = "15" });
states.Add(new SelectListItem { Text = "KLIPRIVIERSBERG 106-IR", Value = "16" });
states.Add(new SelectListItem { Text = "KROMVLEI 142-IR", Value = "17" });
states.Add(new SelectListItem { Text = "LINMEYER", Value = "18" });
states.Add(new SelectListItem { Text = "MAYBERRY PARK", Value = "19" });
states.Add(new SelectListItem { Text = "MAYRO PARK", Value = "20" });
states.Add(new SelectListItem { Text = "MEYERSDAL", Value = "21" });
states.Add(new SelectListItem { Text = "MEYERSDAL NATURE ESTATE", Value = "22" });
states.Add(new SelectListItem { Text = "MPILISWENI", Value = "23" });
states.Add(new SelectListItem { Text = "NEW MARKET AH", Value = "24" });
states.Add(new SelectListItem { Text = "NEW MARKET MANOR", Value = "25" });
states.Add(new SelectListItem { Text = "NEW MARKET PARK", Value = "26" });
states.Add(new SelectListItem { Text = "NEW REDRUTH", Value = "27" });
states.Add(new SelectListItem { Text = "OTHANDWENI", Value = "28" });
states.Add(new SelectListItem { Text = "PALMIETFONTEIN 141-IR", Value = "29" });
states.Add(new SelectListItem { Text = "PHOLA PARK", Value = "30" });
states.Add(new SelectListItem { Text = "RACEVIEW", Value = "31" });
states.Add(new SelectListItem { Text = "RANDHART", Value = "32" });
states.Add(new SelectListItem { Text = "ROODEKOP 139-IR", Value = "33" });
states.Add(new SelectListItem { Text = "ROOIKOP 140-IR", Value = "34" });
states.Add(new SelectListItem { Text = "ROXTON", Value = "35" });
states.Add(new SelectListItem { Text = "SOUTHCREST", Value = "36" });
states.Add(new SelectListItem { Text = "SOUTHDOWNS", Value = "37" });
states.Add(new SelectListItem { Text = "THINASONKE", Value = "38" });
states.Add(new SelectListItem { Text = "THINTWA VILLAGE", Value = "39" });
states.Add(new SelectListItem { Text = "TOKOZA", Value = "40" });
states.Add(new SelectListItem { Text = "TOKOZA 198-IR", Value = "41" });
states.Add(new SelectListItem { Text = "VERWOERDPARK", Value = "42" });
states.Add(new SelectListItem { Text = "WATERVALSPRUIT", Value = "43" });
states.Add(new SelectListItem { Text = "WATERVAL 150-IR", Value = "44" });
states.Add(new SelectListItem { Text = "ZWARTKOPJES 143-IR", Value = "45" });
break;
//Bedfordview surbubs
case "2":
states.Add(new SelectListItem { Text = "Select", Value = "0" });
states.Add(new SelectListItem { Text = "BEDFORD 62-IR", Value = "1" });
states.Add(new SelectListItem { Text = "BEDFORD 68-IR", Value = "2" });
states.Add(new SelectListItem { Text = "BEDFORD GARDENS", Value = "3" });
states.Add(new SelectListItem { Text = "BEDFORD PARK", Value = "4" });
states.Add(new SelectListItem { Text = "BEDFORDVIEW", Value = "5" });
states.Add(new SelectListItem { Text = "ELANDSFONTEIN 90-IR", Value = "6" });
states.Add(new SelectListItem { Text = "ESSEXWOLD", Value = "7" });
states.Add(new SelectListItem { Text = "GELDENHUIS ESTATE SH", Value = "8" });
states.Add(new SelectListItem { Text = "MALVERN EAST", Value = "9" });
states.Add(new SelectListItem { Text = "MORNINGHILL", Value = "10" });
states.Add(new SelectListItem { Text = "OOSPOORT", Value = "11" });
states.Add(new SelectListItem { Text = "ORIEL", Value = "12" });
states.Add(new SelectListItem { Text = "SENDERWOOD", Value = "13" });
states.Add(new SelectListItem { Text = "ST ANDREWS", Value = "14" });
break;
//Benoni surbubs
case "3":
// break;
}
return Json(new SelectList(states, "Value", "Text"), JsonRequestBehavior.AllowGet);
}
dropdpnwsここ
<div class="form-group">
@Html.LabelFor(m => m.Town, new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@*@Html.DropDownListFor(model => model.Town, new SelectList(new string[] { "Alberton", "Bedfordview", "Benoni", "Boksburg", "Brakpan", "Edenvale", "Germiston", "Isando", "OR Tambo Airport", "Kempton Park", "Nigel", "OR Tambo International", "Springs" }))*@
@Html.DropDownList("Town", new SelectList(new string[] { "Alberton", "Bedfordview", "Benoni", "Boksburg", "Brakpan", "Edenvale", "Germiston", "Isando", "OR Tambo Airport", "Kempton Park", "Nigel", "OR Tambo International", "Springs" }))
</div>
</div>
<div class="form-group">
@Html.Label("Surburb", new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.DropDownList("Surburb", new SelectList(string.Empty, "Value", "Text"), "Please select a Surburb", new { style = "width:250px", @class = "dropdown1" })
</div>
</div>
のための私の見解のHTMLヘルパーは、私のjQueryのコードは、データを移入することです。
<script type="text/javascript">
$(document).ready(function() {
//Dropdownlist Selectedchange event
$("#Town").change(function() {
$("#Surburb").empty();
$.ajax({
type: 'GET',
url: '@Url.Action("GetSurburbs")', // we are calling json method
dataType: 'json',
data: { id: $("#Town").val() },
// here we are get value of selected country and passing same value
success: function (states) {
// states contains the JSON formatted list
// of states passed from the controller
$.each(states, function (i, state) {
$("#Surburb").append('<option value="' + state.Value + '">' +
state.Text + '</option>');
// here we are adding option for States
});
},
error: function (ex) {
alert('Failed to retrieve Surburbs.' + ex);
}
});
return false;
})
});
コードはjQueryの中の例外で失敗している、郊外をretrive RTO失敗しました、私を支援してください。
"ex"を警告し、例外がスローされたことを確認できますか？または、AJAXリクエストのエラーを確認するためにコンソールをチェックできますか？ –
関連していませんが、 'SelectList'を返す点はありません（そして、第1のものから' new SelectList（...） 'を使って2番目の同じ 'SelectList'を作成するのはちょっと無意味です）。必要な2つのプロパティを含む匿名オブジェクトのコレクションを返すだけです。コントローラーメソッドでコードをデバッグし、例外がスローされているかどうかを判断する必要があります。 –
成功すると状態パラメーターに何かが得られますか？コンソールで確認してください – Nadeem