Панели и стили обновлений Ajax

У меня есть кнопка, оформленная с помощью js и css, и она находится внутри панели обновления каждый раз, когда я нажимаю кнопку (выполняю обратную передачу), она теряет стиль?

почти уверен, что это простая проблема, есть идеи?

<html xmlns="http://www.w3.org/1999/xhtml">


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

</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Button ID="Button1" runat="server" class="art-button" Text="Button" />
    </ContentTemplate>
</asp:UpdatePanel>
</form>


function artButtonsSetupJsHover(className) {
var tags = ["input", "a", "button"];
for (var j = 0; j < tags.length; j++){
    var buttons = xGetElementsByClassName(className, document, tags[j]);
    for (var i = 0; i < buttons.length; i++) {
        var button = buttons[i];
        if (!button.tagName || !button.parentNode) return;
        if (!artHasClass(button.parentNode, 'art-button-wrapper')) {
            if (!artHasClass(button, 'art-button')) button.className += ' art-button';
            var wrapper = document.createElement('span');
            wrapper.className = "art-button-wrapper";
            if (artHasClass(button, 'active')) wrapper.className += ' active';
            var spanL = document.createElement('span');
            spanL.className = "l";
            spanL.innerHTML = " ";
            wrapper.appendChild(spanL);
            var spanR = document.createElement('span');
            spanR.className = "r";
            spanR.innerHTML = " ";
            wrapper.appendChild(spanR);
            button.parentNode.insertBefore(wrapper, button);
            wrapper.appendChild(button);
        }
        artEventHelper.bind(button, 'mouseover', function(e) {
            e = e || window.event;
            wrapper = (e.target || e.srcElement).parentNode;
            wrapper.className += " hover";
        });
        artEventHelper.bind(button, 'mouseout', function(e) {
            e = e || window.event;
            button = e.target || e.srcElement;
            wrapper = button.parentNode;
            wrapper.className = wrapper.className.replace(/hover/, "");
            if (!artHasClass(button, 'active')) wrapper.className = wrapper.className.replace(/active/, "");
        });
        artEventHelper.bind(button, 'mousedown', function(e) {
            e = e || window.event;
            button = e.target || e.srcElement;
            wrapper = button.parentNode;
            if (!artHasClass(button, 'active')) wrapper.className += " active";
        });
        artEventHelper.bind(button, 'mouseup', function(e) {
            e = e || window.event;
            button = e.target || e.srcElement;
            wrapper = button.parentNode;
            if (!artHasClass(button, 'active')) wrapper.className = wrapper.className.replace(/active/, "");
        });
    }
}

}

artLoadEvent.add (функция () { artButtonsSetupJsHover («арт-кнопка»); });


c# ajax asp.net panels
person Stacker    schedule 14.09.2010    source источник

Ответы (3)


arrow_upward
2
arrow_downward

Вы, вероятно, задаете стиль в js в событии onload, но это событие срабатывает только один раз, и затем при каждой обратной передаче панель обновления не проходит через него. Вы должны подключиться к событию загрузки страницы PageRequestManager следующим образом:

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

<script type="text/jscript">
<!--
 var prm = Sys.WebForms.PageRequestManager.getInstance();
 prm.add_pageLoaded(pageLoaded);

 function pageLoaded(sender, args) {
     document.getElementById("Button1").style.fontWeight = "bold";
 }
-->
</script>

Или напрямую из Sys.Application.add_load:

<script type="text/jscript">
<!--
 Sys.Application.add_load(
     function pageLoaded(sender, args) {
         document.getElementById("Button1").style.fontWeight = "bold";
     });
-->
</script>
person jmservera    schedule 14.09.2010
comment
как мне вместо Sys.Application.add_load (код) сделать Sys.Application.add_load (jsfile)? - person Stacker; 14.09.2010
comment
Вы должны зарегистрировать скрипт в диспетчере скриптов и вызвать метод в add_load - person jmservera; 14.09.2010

arrow_upward
1
arrow_downward

Есть несколько случаев, о которых я могу думать

  1. Вы меняете стиль кода позади.
  2. Вы меняете стиль с помощью скрипта, чтобы после обновления вы не запускали скрипт снова.
  3. Вы меняете положение DOM вашей кнопки, чтобы стиль больше не работал для этой позиции.

.Если вы дадите нам код, возможно, мы сможем увидеть, в чем проблема.

person Aristos    schedule 14.09.2010
comment
@Stacker было 2 варианта, какой-то другой ответ отсутствовал. - person Aristos; 14.09.2010

arrow_upward
1
arrow_downward

Если вы устанавливаете стили с помощью js, вам может потребоваться зарегистрировать этот js с помощью ScriptManager на странице. Таким образом, скрипт будет загружаться при частичной обратной передаче страницы.

person derek    schedule 14.09.2010