Я использую jqGrid 4.2.0.В EditForm есть два выбора: 1) REGION_ID - заполняется при открытии формы 2) TOWN_ID - должен показывать города выбранного региона
Когда я открываю форму в первый раз и меняю REGION, список городов не отображаетсяизменение и функция regionOnChange не вызывается.Но когда я закрываю форму и снова нажимаю кнопку «Добавить» после изменения региона, список городов меняется.
Пожалуйста, помогите решить эту проблему.
colModel: [
{ name: 'Id', index: 'Id', width: 30, align: 'left', hidden: true, editrules: { edithidden: true} },
{ name: 'NAME', index: 'NAME', width: 250, align: 'left', editable: true, editoptions: { size: 64} },
{ name: 'REGION_ID', index: 'REGION_ID', hidden: true, edittype: "select", editable: true, editrules: { edithidden: true }
, editoptions: { dataUrl: '/Directory/GetRegion?countryId_=0',
buildSelect: function(data) {
var d = jQuery.parseJSON(data)
var s = '<select id="TOWN_ID">';
if (d.length) {
$.each(d, function(i) {
s += '<option value="' + this.id + '">' + this.name + '</option>';
});
}
return s + "</select>";
}
}
},
{ name: 'TOWN_ID', index: 'TOWN_ID', hidden: true, edittype: "select", editable: true, editrules: { edithidden: true }
, editoptions: { dataUrl: '/Directory/GetTowns?regionId_=62',
buildSelect: function(data) {
var d = jQuery.parseJSON(data)
var s = '<select>';
if (d.length) {
$.each(d, function(i) {
s += '<option value="' + this.id + '">' + this.name + '</option>';
});
}
return s + "</select>";
}
}
},
...
jQuery("#list").jqGrid('navGrid', '#pager',
{ del: false, add: true, edit: false, search: false, jqModal: true }, //options
{}, //edit option
{width: 450, jqModal: true, closeAfterAdd: true, afterSubmit: processAddEdit, afterShowForm: processShowForm
,onInitializeForm: onInitFrm }, //add option
{}, //del
{}, //search
{}
);
И это код, как меняется список TOWN после выбора enother REGION
function onInitFrm(formid) {
$("select").filter("#REGION_ID").change(regionOnChange);
}
function processShowForm(formid) {
$("select").filter("#REGION_ID").change(regionOnChange);
}
function regionOnChange(reg) {
var f = $("select[id='REGION_ID'] option:selected").val();
$("select[id='TOWN_ID'] option").remove();
if (f > 0) {
$.getJSON("/Directory/GetTowns", { regionId_: f }, getTown);
}
}
function getTown(tow) {
$("select[id='TOWN_ID'] option").remove();
$("select[id='TOWN_ID']").append("<option value=0> </option>");
$.each(tow, function(i) {
$("select[id='TOWN_ID']").append("<option value=" + this.id + ">" + this.name + "</option>");
});
}