ASP.Net - Javascript внутри панели обновления AJAX - PullRequest
Новая
       9

ASP.Net - Javascript внутри панели обновления AJAX

10 голосов
/ 23 декабря 2009

У меня проблема с запуском javascript из внешнего файла javascript внутри UpdatePanel. Я пытаюсь заставить палитру цветов работать внутри ListView. ListView находится внутри UpdatePanel.

Я использую этот палитр цветов .

Вот что я сузил до:

  • Если я использую палитру цветов в текстовом поле за пределами UpdatePanel, она отлично работает во всех постбэках.

  • Если я использую палитру цветов в текстовом поле внутри UpdatePanel, она будет работать до тех пор, пока я не выполню асинхронную обратную передачу (нажимая кнопку «РЕДАКТИРОВАТЬ» в ListView). Как только UpdatePanel выполнит обратную передачу, текстовое поле больше не будет отображать палитру цветов при нажатии. То же самое происходит, когда текстовое поле находится в InsertItemTemplate или EditItemTemplate ListView.

Если вы хотите скопировать его, просто скачайте палитру цветов (это бесплатно), а затем добавьте ее на веб-страницу ... 

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<div>
    <asp:UpdatePanel ID="panel1" runat="server">
        <ContentTemplate>
            <asp:TextBox runat="server" ID="textbox" CssClass="color" />
            <asp:Button ID="Button1" runat="server" Text="Button" />
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

Когда страница загружается, палитра цветов работает нормально. При нажатии на кнопку (которая выполняет обратную передачу) средство выбора цвета больше не будет работать.

Есть идеи?

Ответы [ 4 ]

15 голосов
/ 23 декабря 2009

После асинхронного приема-передачи все скрипты запуска не будут запускаться, поэтому, вероятно, он не работает после обратного вызова AJAX. Палитра цветов, вероятно, имеет функции, которые необходимо выполнить при загрузке страницы.

Я сталкивался с этим так много раз, что написал небольшой метод для регистрации своих сценариев в выделенном фрагменте кода, который обрабатывает как асинхронные, так и неасинхронные циклы. Вот основная схема: 

private void RegisterClientStartupScript(string scriptKey, string scriptText)
{
    ScriptManager sManager = ScriptManager.GetCurrent(this.Page);

    if (sManager != null && sManager.IsInAsyncPostBack)
    {
        //if a MS AJAX request, use the Scriptmanager class
        ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), scriptKey, scriptText, true);
    }
    else
    {
        //if a standard postback, use the standard ClientScript method
        scriptText = string.Concat("Sys.Application.add_load(function(){", scriptText, "});");
        this.Page.ClientScript.RegisterStartupScript(this.Page.GetType(), scriptKey, scriptText, true);
    }
}

Я запекла все вышеперечисленное в базовый класс страниц, чтобы любая страница, с которой я работаю, могла вызывать this.RegisterClientStartupScript(...). Для этого просто создайте базовый класс страницы и включите его туда (убедитесь, что помечены как защищенные, а не как частные, или ваши наследующие классы страниц не смогут получить к нему доступ).

С помощью приведенного выше кода я могу уверенно регистрировать клиентские сценарии независимо от того, выполняет ли страница обратный или обратный вызов. Понимая, что вы используете внешние файлы сценариев, вы, вероятно, могли бы изменить вышеуказанный метод для регистрации внешних сценариев, а не встроенных. Обратитесь к ScriptManager классу для получения более подробной информации, так как есть несколько методов регистрации скриптов ...

2 голосов
/ 23 декабря 2009

Посмотрев исходный код jscolor, я заметил, что он инициализирует все при загрузке окна. Таким образом, вам, вероятно, потребуется повторно выполнить что-то вроде этого (внутри UpdatePanel): 

function yourInit(){
   /* keep in mind that the jscolor.js file has no way to determine
      that the script has already been initialized, and you may end
      up initializing it twice, unless you remove jscolor.install();
   */

   if (typeof(jscolor) !== 'undefined'){
      jscolor.init();
   }
}
if (typeof(Sys) !== 'undefined'){
   Sys.UI.DomEvent.addHandler(window, "load", yourInit);
}
else{
   // no ASP.NET AJAX, use your favorite event
   // attachment method here
}

Если вы решите поместить скрипт jscolor в UpdatePanel, вам также нужно добавить что-то вроде этого в конец jscolor.js: 

if(Sys && Sys.Application){
   Sys.Application.notifyScriptLoaded();
}
1 голос
/ 23 декабря 2009

Вы пробовали ScriptManager.RegisterStartupScript, который позволяет вам «добавлять JavaScript с сервера на страницу при выполнении асинхронной обратной передачи»?

0 голосов
/ 23 декабря 2009

Я думаю, что код jscolor.js, который запускается для настройки палитры цветов, вызывается только при первой загрузке страницы, поэтому при регенерации элемента управления на сервере вы теряете изменения, внесенные jscolor. Не могли бы вы зарегистрировать некоторый JavaScript, который будет вызываться в вашем коде, чтобы он вызывал метод init в jscolor, когда ваш асинхронный вызов завершен?

...