將ScriptPath添加到<asp：scriptmanager刷新頁面。如何阻止頁面刷新？

Question

我在updatepanel內部使用下拉菜單，問題在於頁面刷新時從我的下拉列表中選擇值。最初更新面板工作正常，直到我添加到asp：scriptmanager的ScripPath。

即使現在，如果我從scriptmanager中刪除ScriptPath，頁面不會刷新並且行爲如預期。

我添加ScriptPath的原因是，我希望每次在下拉列表中更改值時執行abc.js。正如所料，abc.js是爲我的下拉列表中的每個選定值執行的，但我不希望頁面被刷新。

那麼，即使添加scriptpath到asp：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上設置Path屬性。

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> 

在javascript中收聽onChange事件。
jQuery讓這個簡單：

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

OnSelectedIndexChanged是一個服務器端的功能，執行JS，你應該聽onchange事件。

Answer 3

您可以從下拉列表控件中刪除AutoPostback屬性。這將停止回發，並只會執行JavaScript。不要忘記將JavaScript事件處理程序添加到下拉列表的onchange事件中。您可能會刪除更新面板，除非您需要它執行部分頁面回發，從您的描述中，這聽起來不像您。

最好的問候。