例に従って、別のドロップダウンの選択からドロップダウンを更新しました。
var pageUrl = '<%=ResolveUrl("~/Reports.aspx")%>';
function PopulatePortfolioDropDown() {
var ddl = document.getElementById('<%=ddlPortfolio.ClientID %>');
ddl.options.length = 0;
var prgyr = document.getElementById('<%= ddlProgYear.ClientID %>');
var agy = document.getElementById('<%= ddlAgency.ClientID %>');
$telerik.$('#<%=ddlPortfolio.ClientID %>').empty(); //.append('<option selected="selected" value="0">Please Select...</option>');
var str = prgyr.options[prgyr.selectedIndex].text + '|' + agy.options[agy.selectedIndex].value;
$telerik.$.ajax({
type: "POST",
url: pageUrl + '/LoadPortfolioDDL1',
data: '{yearcode:"' + str + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnPortfolioData,
failure: function (response) {
alert(response.d);
}
});
}
function OnPortfolioData(response) {
PopulateControl(response.d, $telerik.$('#<%=ddlPortfolio.ClientID %>'));
}
function PopulateControl(list, control) {
if (list.length > 0) {
control.attr("disabled", false);
control.empty();
$telerik.$.each(list, function () {
control.append($telerik.$("<option></option>").val(this['Value']).html(this['Text']));
});
}
else {
control.empty().append('<option selected="selected" value="0">Not available<option>');
}
}
これは、ddlAgency が最初に選択されたときにうまく機能します。2 番目の選択を行うと、表示されたリストは更新されず、元のリストが引き続き表示されます。ただし、2 番目のリストでアイテムの 1 つを選択すると、(2 番目の呼び出しで) 更新されたアイテムが正しく表示されます。これはIEの問題ですか?もう少し情報: 更新したい DDL には、ページの読み込み時にデータが入力されていません。DDL を選択すると、オプションは表示されません。制御 DDL で選択を行った後でも、2 番目の DDL にはアイテムが表示されません。DDL をクリックしないと、項目が表示されます。DDL は、最初にクリックしたときの内容を保持するようです。これは理にかなっていますか?一体何がこれを引き起こしているのですか?データが消去され、新しいオプションが追加されていることはわかっていますが、ページにはまだ古いリストが表示されているか、まったく表示されていません。