Проблема При использовании плагина Jquery JqTransform на панели обновления Ajax в asp.net

Question

Я столкнулся с проблемой при использовании плагина Jquery JqTransform с элементами управления на панели обновления Ajax в asp.net. Вот код:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnablePartialRendering="true"></asp:ToolkitScriptManager>

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
      <asp:DropDownList ID="ddlArtist" runat="server" AutoPostBack="True" onselectedindexchanged="ddlArtist_SelectedIndexChanged"></asp:DropDownList>
      <p class="maintext"><asp:Literal ID="ltrArtistDesc" runat="server"></asp:Literal></p>
    </ContentTemplate>

    <Triggers>
       <asp:AsyncPostBackTrigger ControlID="ddlArtist" EventName="SelectedIndexChanged" />
    </Triggers>

</asp:UpdatePanel>

при загрузке страницы применяется jqtransform для преобразования выпадающего и других элементов управления и применения некоторого стиля. Но как только я выбираю альбом из выпадающего списка, он выполняет обратную передачу и получает дополнительную информацию из базы данных. Чтобы избежать полной обратной передачи, я использую панель обновления. Но после его использования я столкнулся с проблемой «мои элементы управления на странице не конвертируются с помощью jqtransform».

В заголовке страницы есть скрипт, файл, который вызывает JqTransform. Вот оно:

<script language="javascript" type="text/javascript">
        $(function(){
            $('form').jqTransform({imgPath:'jqtransformplugin/img/'});
        });
</script>

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

Answer 1

Если вы хотите вызывать свой метод jquery при каждой обратной передаче, вам нужен Ajax pageLoad, а не только готовый документ.Чтобы заставить jqTransform работать на pageLoad, используйте следующее:

<script type="text/javascript">

    function pageLoad() {
        $("form").removeClass("jqtransformdone");
        $("form").jqTransform(); 
    };

</script>

Answer 2

В случае панели обновления Microsoft

$(document).ready(function () {
        var prm = Sys.WebForms.PageRequestManager.getInstance();

     prm.add_endRequest(EndRequest);

     function EndRequest(sender, args) {

             $('form.jqtransform').removeClass('jqtransformdone');
             $('form.jqtransform').removeClass('jqTransformHidden');

                    $("form.jqtransform").jqTransform({ selectwidth: 240 });
            }
});

Answer 3

Создайте новый div внутри <ContentTemplate> и вызовите плагин jqTransform для этого div.

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
    <div class="formstyle">
        ......... Your form elements
    </div>
    </ContentTemplate>
</asp:UpdatePanel>

, а затем вызовите плагин jqTransform, как показано ниже:

<script type="text/javascript">
  $(function () {
    //Initial bind
    $(document).ready(function () {
      BindControlEvents();

      //Re-bind for callbacks
      var prm = Sys.WebForms.PageRequestManager.getInstance();
      prm.add_endRequest(function () {
        BindControlEvents();
      });

      function BindControlEvents() {
        $('.formstyle').jqTransform();
      }
    });
  });
</script>

jqTransform работал нормально для меня даже после получения обратной передачи через панель обновления.

Answer 4

У меня была такая ситуация раньше, это не проблема, это дизайн.То, что вы делаете, это перезагружаете новый список в выпадающий список, эффективно уничтожая то, что уже отрендерено.Похоже, что частичная обратная передача - это вызов ajax, так что, например, если ваша функция ajax выглядела таквся форма для исполнения.Надеюсь, это поможет!