Обновление элемента управления вне UpdatePanel

Question

Итак, у меня есть UserControl с некоторыми каскадными DropDownList с. Выбор из списка 1 включает список 2, который, в свою очередь, включает список 3. После того, как вы сделали выбор во всех трех списках, вы можете перейти к следующей странице.

DropDownList все находятся внутри UpdatePanel. Но кнопка «Следующая страница» находится за пределами UpdatePanel. Эта кнопка должна быть отключена до тех пор, пока у всех трех списков не будет выбора, а затем она должна быть включена снова. Но поскольку кнопка находится за пределами UpdatePanel, она не обновляется, когда я делаю выбор. ( Редактировать : кнопка «Следующая страница» находится на странице, которая также содержит UserControl.)

Я знаю один способ решить эту проблему:

var scriptManager = ScriptManager.GetCurrent(this.Page);
scriptManager.RegisterPostBackControl(dropDownList1);
scriptManager.RegisterPostBackControl(dropDownList2);
scriptManager.RegisterPostBackControl(dropDownList3);

Это обеспечивает обратную передачу при изменении любого раскрывающегося списка, чтобы кнопка могла обновляться. Но если я сделаю это, я мог бы упростить, избавившись в первую очередь от UpdatePanel.

Есть ли другой способ, через какой-то умный JavaScript или что-то еще, что я могу обновить элемент управления вне UpdatePanel без необходимости отказываться от Ajax?

Answer 1

Разместите UpdatePanel вокруг следующей кнопки и создайте триггер для каждого из раскрывающихся списков, чтобы он запускал асинхронную обратную передачу. Пример:

<Triggers>
    <asp:AsyncPostBackTrigger ControlID="dropDownList1" />
    <asp:AsyncPostBackTrigger ControlID="dropDownList2" />
    <asp:AsyncPostBackTrigger ControlID="dropDownList3" />
</Triggers>

Answer 2

Не могли бы вы добавить панель обновления вокруг «следующей страницы», а затем добавить триггер в панель обновления выпадающего списка для запуска панели обновления следующей страницы?

Просто выбрасываю идеи, даже не попробовав :):

Answer 3

вы можете обновить элемент управления вне панели обновления, поместив его в update_panel2 и сказав update_panel2.update().

Обратите внимание, что UpdateMode UpdatePanel должен быть установлен на conditional, чтобы это работало.

Answer 4

В идеале это должно быть сделано в javascript с проверкой на стороне сервера в обработчике события click.

Быстрый пример jQuery:

//assuming the dropdowns all have the css class "cascade"
$('select.cascade').change(function() {
  If ($('option:selected',this).length == 3) {
    $('input[id$=btnNext]').removeAttr('disabled');
  }
});