업데이트 패널에서 Jquery 스타일을 제거합니다.

Question

asp.net 컨트롤과 함께 다음 JQuery UI 코드를 사용하고 있습니다.

<script type="text/javascript"> 

     $(document).ready(function() { 

      $(".Accordion").accordion({ 
       heightStyle: "content" 
      }); 

      $(".special").button(); 

      $(".radio").buttonset(); 

      //$(".tabs").tabs(); 
      $(".tabs").tabs(); 

     }); 

    </script> 

그리고 코드가 제대로 작동 할 때까지 모든 컨트롤을 업데이트 패널에 넣기로했습니다. 포스트 백에서는 모든 스타일이 컨트롤에서 제거됩니다. 무엇이 문제입니까?

$ (문서) .ready()가 업데이트 패널을 작동하지 않기 때문에 당신은, 당신의 스크립트를 수정해야

Answer 1

: 코드 숨김에서

function InitCss() { 

     $(".Accordion").accordion({ 
      heightStyle: "content" 
     }); 

     $(".special").button(); 

     $(".radio").buttonset(); 

     //$(".tabs").tabs(); 
     $(".tabs").tabs(); 

    } 

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(InitCss); 

같은 :

protected void Page_Load(object sender, EventArgs e) 
    { 
if (!this.Page.ClientScript.IsStartupScriptRegistered("InitCss")) 
     { 
      string script = @"function InitCss() { 

     $("".Accordion"").accordion({ 
      heightStyle: ""content"" 
     }); 

     $("".special"").button(); 

     $("".radio"").buttonset(); 

     //$("".tabs"").tabs(); 
     $("".tabs"").tabs(); 

    } 

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(InitCss);"; 
      ScriptManager.RegisterStartupScript(Page, Page.GetType(), "InitCss", script, true); 
     } 
} 

Answer 2

귀하의 초기화 준비된 문서에서만 다시 실행됩니다 (포스트 백이 아님). UpdatePanel에 컨트롤을 배치 했으므로 포스트 백 이후에는 아무 것도 업데이트되지 않습니다. 다시 게시 후에 초기화를 호출해야합니다. 기존 스크립트 옆에 다음 코드를 추가하십시오.

<script type="text/javascript"> 
var prm = Sys.WebForms.PageRequestManager.getInstance(); 

prm.add_endRequest(function(s, e) { 
    $(".Accordion").accordion({ 
       heightStyle: "content" 
      }); 

      $(".special").button(); 

      $(".radio").buttonset(); 

      //$(".tabs").tabs(); 
      $(".tabs").tabs(); 
}); 
</scipt>