Ajax.BeginFormの送信後、ドロップダウンリストカスケードchange()はすぐには起動しません。
新しいDropDownListを生成するビュー:
@model Heelp.ViewModels.CreateAdCategoryTypeViewModel
@using (Ajax.BeginForm(MVC.Ad.CreateAd(), new AjaxOptions { UpdateTargetId = "ad", InsertionMode = InsertionMode.Replace }, new { @id = "categoryTypeForm" }))
{
@Html.HiddenFor(m => m.Category_Id)
@Html.DisplayNameFor(m => m.CategoryType_Id)
@Html.DropDownListFor(m => m.CategoryType_Id, Model.CategoryList, HeelpResources.DropdownlistCategoryFirstRecord)
@Html.ValidationMessageFor(m => m.CategoryType_Id)
}
サビットの後、生成されるビューは次のとおりです。
@model Heelp.ViewModels.CreateAdCarViewModel
@using (Html.BeginForm()) {
<fieldset>
<legend>Car</legend>
<div id="makes">
@Html.DisplayNameFor(m => m.Make_Id)
@Html.DropDownListFor(m => m.Make_Id, Model.MakeList, HeelpResources.DropdownlistMakeFirstRecord)
@Html.ValidationMessageFor(m => m.Make_Id)
</div>
<div id="models">
@Html.DisplayNameFor(m => m.Model_Id)
@Html.DropDownListFor(m => m.Model_Id, Model.ModelList)
@Html.ValidationMessageFor(m => m.Model_Id)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
この時点で、モデルリストを埋めるために変更を加えたときに起動するカスケード関数があります。
$(document).ready(function () {
$(document).on("change", "#Make_Id", function () {
$('#Make_Id').cascade({
source: "/Ad/ListModelByMake",
cascaded: "Model_Id"
});
});
});
カスケード機能:
// Cascade function
(function ($) {
$.fn.cascade = function (options) {
var defaults = {};
var opts = $.extend(defaults, options);
return this.each(function () {
$(this).change(function () {
var selectedValue = $(this).val();
var params = {};
params[opts.paramName] = selectedValue;
$.post(opts.url, params, function (items) {
//$.getJSON(opts.url, params, function (items) {
opts.childSelect.empty();
if (opts.firstOption != "")
opts.childSelect.append(
$('<option/>')
.attr('value', '-1')
.text(opts.firstOption));
$.each(items, function (index, item) {
// alert(opts.firstOption);
opts.childSelect.append(
$('<option/>')
.attr('value', item.Id)
.text(item.Name)
);
});
});
});
});
};
})(jQuery);
残念ながら、それはMakesドロップダウンリストの2番目の変更の後にのみ機能します、何か考えはありますか?
ありがとう。