Блог

Я создал серверный элемент управления, в который я встроил некоторые файлы JavaScript. Это работает нормально, но когда серверный элемент управления помещается в ajax UpdatePanel, он перестает работать после запуска асинхронной обратной передачи в updatepanel.

Вот мой код в серверном элементе управления:

 protected override void OnPreRender(EventArgs e)
{
  base.OnPreRender(e);

  ClientScriptManager clientScriptManager = Page.ClientScript;
  const string DATE_TIME_PICKER_JS = "JQueryControls.Scripts.DateTimePicker.js";

  clientScriptManager.RegisterClientScriptResource(typeof(DateTimePicker), DATE_TIME_PICKER_JS);

  if (Ajax.IsControlInsideUpdatePanel(this) amp;amp; Ajax.IsInAsyncPostBack(Page))
  {
      Ajax.RegisterClientScriptResource(Page, typeof(DateTimePicker), DATE_TIME_PICKER_JS);
  }
}
  

Ajax — это класс из этой ссылки.

Где этот код выполняется при асинхронной обратной передаче:

 public static void RegisterClientScriptResource(Page page, Type type, string resourceName) {
    object scriptManager = FindScriptManager(page);
    if (scriptManager != null) {
        System.Type smClass = GetScriptManagerType(scriptManager);
        if (smClass != null) {
            Object[] args = new Object[] { page, type, resourceName };
            smClass.InvokeMember("RegisterClientScriptResource",
                    System.Reflection.BindingFlags.Static |  System.Reflection.BindingFlags.Public |
                    System.Reflection.BindingFlags.InvokeMethod,
                    null, null, args);
        }
    }
}
  

Есть идеи о том, как заставить это работать в UpdatePanel?

Панели обновлений приводят к размещению новых элементов на странице при обратной отправке. Это уже не тот же элемент, поэтому ваши привязки больше не на месте. Если вы используете jQuery и связываете события вместе, вы можете использовать их live API, найденный здесь. В противном случае для таких вещей, как datepickers, которые запускаются один раз и коренным образом меняют функциональность элемента, вам нужно запустить некоторый javascript после загрузки новых элементов; все, что для этого требуется, это привязать некоторые вызовы javascript к функции обратного вызова, предоставляемой Microsoft:

 function BindEvents()
{
    //Here your jQuery function calls go
}

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(BindEvents);
  

Редактировать: Основываясь на вашем комментарии, я бы сделал DatePicker.js файл, подобный этому:

 $(document).ready(function () {
    // Call BindDatePicker so that the DatePicker is bound on initial page request
    BindDatePicker();

    // Add BindDatePicker to the PageRequestManager so that it
    // is called after each UpdatePanel load
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(BindDatePicker);
});

// We put the actual binding of the DatePicker to the input here
// so that we can call it multiple times. Other binds that need to happen to the
// elements inside the UpdatePanel can be put here as well.
var BindDatePicker = function() {
    $('.DatepickerInput').datepicker({
        showAnim: 'blind',
        autoSize: true,
        dateFormat: 'dd-mm-yy'
    });
};