<asp에 scriptPath 추가 : scriptmanager는 페이지를 새로 고칩니다. 페이지를 새로 고치는 것을 멈추는 방법?

Question

updatepanel에서 드롭 다운을 사용하고 있는데 문제가 있습니다. 내 드롭 다운에서 값을 선택하면 페이지가 새로 고침됩니다. ScripPath를 asp : scriptmanager에 추가 할 때까지 처음에는 업데이트 패널이 정상적으로 작동했습니다.

ScriptManager에서 ScriptPath를 제거해도 페이지가 새로 고침되지 않고 동작이 예상대로입니다.

내가 ScriptPath를 추가하는 이유는 드롭 다운에서 값이 변경 될 때마다 abc.js를 실행하려고하기 때문입니다. 예상대로 abc.js는 내 드롭 다운의 모든 선택된 값에 대해 실행되지만 페이지를 새로 고치지 않습니다.

그래서, asp에 scriptpath를 추가 한 후에도 페이지가 새로 고쳐지는 것을 멈추는 방법 : scriptmanager?

아래는 내 .aspx 소스입니다.

<asp:ScriptManager ScriptPath="abc.js" runat="server"></asp:ScriptManager> 

<asp:UpdatePanel ID="UP_Social_Ddl" runat="server"> 
         <ContentTemplate> 
          <div class="styled-select"> 
           <asp:Label runat="server" ID="Label2" Font-Size="Small" ToolTip="Social : 'ON' will post your activity on this page to your FaceBook Wall." Text="Social :" Style="vertical-align: top;" /> 
           <asp:DropDownList ID="ddlSocialSwitch" runat="server" AutoPostBack="true" Style="vertical-align: top;" ToolTip="Social : ON will post your activity on this page to your FaceBook Wall." OnSelectedIndexChanged="ddlSocialSwitch_SelectedIndexChanged"> 
           </asp:DropDownList> 
           &nbsp;<a valign="bottom" onclick="logout_fb" href="#" id="auth-logoutlink"><img valign="bottom" src="facebookLogOutButton.png"/></a> 
           <asp:Label ID="lbl" Visible="false" runat="server"></asp:Label> 
          </div> 
         </ContentTemplate> 
        </asp:UpdatePanel> 

JS

//Get values from hidden field 
var appid = document.getElementById("appid").value; 
var message = document.getElementById("message").value; 
var link = document.getElementById("link").value; 
var name = document.getElementById("name").value; 
var picture = document.getElementById("picture").value; 
var description = document.getElementById("description").value; 

var Authenticated = ""; 
// Load the SDK Asynchronously 
(function (d) { 
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0]; 
    if (d.getElementById(id)) { return; } 
    js = d.createElement('script'); js.id = id; js.async = true; 
    js.src = "//connect.facebook.net/en_US/all.js"; 
    ref.parentNode.insertBefore(js, ref); 
} (document)); 

//Init the SDK upon load 
window.fbAsyncInit = function() { 
    FB.init({ 
     appId: appid, // App ID 
     channelUrl: '//' + window.location.hostname + '/channel', // Path to your Channel File 
     status: true, // check login status 
     cookie: true, // enable cookies to allow the server to access the session 
     xfbml: true // parse XFBML 
    }); 
    // listen for and handle auth.statusChange events 
    FB.Event.subscribe('auth.statusChange', function (response) { 
     if (response.authResponse) { 
      // user has auth'd your app and is logged into Facebook 
      var uid = "http://graph.facebook.com/" + response.authResponse.userID + "/picture"; 
      FB.api('/me', function (me) { 
       document.getElementById('auth-displayname').innerHTML = me.name; 
       document.getElementById('profileImg').src = uid; 
      }) 
      document.getElementById('auth-loggedout').style.display = 'none'; 
      document.getElementById('auth-loggedin').style.display = 'block'; 

      var e = document.getElementById("FB_ddlSocialSwitch"); 
      var Social_switch = e.options[e.selectedIndex].value; 

      if (Social_switch == "on") { 
       alert(Social_switch); 
      } 

      //_______________________________________________Post to FB_______________________________________________________ 
      // var opts = { 
      //  message: 'A good reference for APIs', 
      //  link: window.location.href, 
      //  name: 'API Reference', 
      //  picture: 'http://www.demo.lookmywebpage.com/publish-on-facebook-wall/Google-Twitter-Facebook.jpg', 
      //  description: 'Demo Facebook Post' 
      // }; 
      // 
      // FB.api('/me/feed', 'post', opts, function (response) { 
      //  if (!response || response.error) { 
      //   alert('Posting error occured'); 
      //  } 
      //  else { 
      //   alert('Success - Post ID: ' + response.id); 
      //  } 
      // }); 
      //________________________________________________________________________________________________________________ 

     } else { 
      // user has not auth'd your app, or is not logged into Facebook 
      document.getElementById('auth-loggedout').style.display = 'block'; 
      document.getElementById('auth-loggedin').style.display = 'none'; 
     } 

    }); 
    $("#auth-logoutlink").click(function() { 
     FB.logout(function() { 
      window.location.reload(); 
     }); 
    }); 
} 

Answer 1

는 "SCRIPTPATH"를 사용하지 고려한다. 각각의 ScriptReference에 경로 속성을 대신 설정하십시오.

ScriptPath : 더 이상 사용되지 않음. ASP.NET Ajax 및 사용자 지정 스크립트 파일에 대한 경로를 작성하는 데 사용되는 위치의 루트 경로를 가져 오거나 설정합니다.

예 :

<asp:ScriptManager ID="ScriptManager1" 
           EnablePartialRendering="True" 
           runat="server"> 
      <Scripts> 
       <asp:ScriptReference Path="~/abc.js" /> 
      </Scripts> 
      </asp:ScriptManager> 

Answer 2

귀하는이 권리를 행사하지 않습니다. js 스크립트를 페이지에 정적으로 보관하십시오.

<asp:ScriptManager ID="ScriptManager1" 
           EnablePartialRendering="True" 
           runat="server"> 
    <Scripts> 
    <asp:ScriptReference Path="~/abc.js" /> 
    </Scripts> 
</asp:ScriptManager> 

자바 스크립트로 onChange 이벤트를 수신하십시오.
jQuery를이 쉽게 :

$("#<%=ddlSocialSwitch.ClientID%>").change(function(e) { 
     //handle the change 
}); 

OnSelectedIndexChanged 당신이 onchange를 이벤트를 수신해야 JS 실행, 서버 측 기능입니다.

Answer 3

드롭 다운 목록 컨트롤에서 AutoPostback 속성을 제거 할 수 있습니다. 그 다시 게시를 중지하고 그냥 자바 스크립트를 실행합니다. 드롭 다운 목록의 onchange 이벤트에 javascript 이벤트 핸들러를 추가하는 것을 잊지 마십시오. 설명 부분에서 볼 수있는 부분 페이지 다시 게시가 필요한 경우가 아니면 업데이트 패널을 제거 할 수 있습니다.

좋습니다.