2013-02-04 191 views
0

我之前在本網站上詢問過有關ajax客戶端 - 服務器通信的問題。ajax客戶端 - 服務器通信

我得到了很多幫助。但仍然無法解決,所以重新提出這個問題。

我嘗試從我的JavaScript頁面發送存儲在變量'mem_ID'中的值... Default.aspx到我的服務器端 - Default.aspx.cs頁面。

的Javascript: -

<asp:Button ID="Button6" runat="server" BackColor="Silver" 
      onclientclick="store_memID()" style="margin-left: 20px" Text="Submit" 
      Width="102px" Font-Bold="True" Height="28px" /> 


<script type = "text/javascript" src ="http://code.jquery.com/jquery-1.9.0.min.js"> </script> 


<script type = "text/javascript"> 

     // Function to caputure client-input- Member_ID. 
     function store_memID() { 

      // 'TextBox3' is the server side ID. To get the client side ID we do the following:- 
      mem_ID = document.getElementById('<%=TextBox3.ClientID%>').value; 

      //return confirm('TimeLine is displayed for: ' + mem_ID); 

      ajax(); 
     } 


     function ajax(){ 
      $.ajax({ 
       url: 'Default.aspx/MyMethod', 
       type: 'POST', 
       contentType: 'application/json; charset=utf-8', 
       data: JSON.stringify({ memID: mem_ID }), 
       success: function (result) { 
       alert(result.d); 
       } 
      }); 

     } 

     </script> 

服務器端: -

public partial class _Default : System.Web.UI.Page 
    { 


     protected void Page_Load(object sender, EventArgs e) 
     { 

     } 


     // Defining a page method. 
     [WebMethod] 
     public static string MyMethod(string mem_ID) 
     { 
      return string.Format("Thanks for calling me with id: " + mem_ID); 



     } 
` more code here`.... 

不過,我仍然沒有得到從服務器返回的任何答覆。我期待着從服務器端返回「謝謝帶ID:.....」。有任何想法嗎?

我在服務器端的響應行MyMethod中添加了一個斷點,但沒有命中。所以我假設這條線甚至沒有被遍歷。

我是新來的Asp.net和Ajax。並需要關於此主題的幫助。

回答

1
<form id="form1" runat="server"> 
    <div> 
    <asp:Button ID="Button6" runat="server" BackColor="Silver" 
      onclientclick="store_memID()" style="margin-left: 20px" Text="Submit" 
      Width="102px" Font-Bold="True" Height="28px" /> 
<script type = "text/javascript" src ="http://code.jquery.com/jquery-1.9.0.min.js"> </script> 
<script type = "text/javascript"> 

    // Function to caputure client-input- Member_ID. 
    function store_memID() { 
     var mem_ID; 
     // 'TextBox3' is the server side ID. To get the client side ID we do the following:- 
     mem_ID = document.getElementById('<%=TextBox3.ClientID%>').value; 

     //return confirm('TimeLine is displayed for: ' + mem_ID); 

     ajax(mem_ID); 
    } 
    function ajax(mem_ID) { 
     alert(mem_ID); 
     $.ajax({ 
      url: 'Default.aspx/MyMethod', 
      type: 'POST', 
      contentType: 'application/json; charset=utf-8', 
      data: JSON.stringify({ memID: mem_ID }), 
      success: function (result) { 
       alert(result.d); 
      } 
     }); 
    } 
     </script> 
    <asp:TextBox id="TextBox3" runat="server"></asp:TextBox> 
    </div> 
    </form> 
In Your Code Behind 

[WebMethod] 
     public static string MyMethod(string memID) 
     { 
      return string.Format("Thanks for calling me with id: " + memID); 
     } 

The method u have done all was right execpt, 
The data passing from ajax should match the string Element declared in the Web-method. 
0

您將此值作爲JSON對象傳遞,它對於爲請求指定dataType並指定從服務器返回的格式很重要。

function ajax(){ 
      $.ajax({ 
       url: 'default.aspx/MyMethod', 
       type: 'POST', 
       dataType: "json", 
       contentType: 'application/json; charset=utf-8', 
       data: JSON.stringify({ memID: mem_ID }), 
       success: function (result) { 
       alert(result.d); 
       } 
      }); 
     } 


// Defining a page method. 
[WebMethod] 
[ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
public static string MyMethod(string mem_ID) 
{ 
      return string.Format("Thanks for calling me with id: " + mem_ID); 
} 

然後你需要添加一個ScriptManager和UpdatePanel來觸發Ajax調用。 ScriptManager提供從Aspx頁面調用WebMethods的功能。與我提供的上述代碼一起使用。

<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"/> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
    <ContentTemplate> 

     <asp:Button ID="Button6" runat="server" BackColor="Silver" OnClientClick="store_memID()" 
     Style="margin-left: 20px" Text="Submit" Width="102px" Font-Bold="True" Height="28px" /> 

     <asp:TextBox ID="TextBox3" runat="server">Testing</asp:TextBox> 
    </ContentTemplate> 
</asp:UpdatePanel> 

</form> 
</body> 
+0

仍然沒有迴音,但... – Philo

+0

非常感謝大家,你們非常有幫助。感謝讓我開始達林!和Muthuram! – Philo

1

這裏有一個完整的例子我爲你寫上手:

<%@ Page Language="C#" %> 
<%@ Import Namespace="System.Web.Services" %> 
<script type="text/c#" runat="server"> 
    [WebMethod] 
    public static string MyMethod(string memId) 
    { 
     return string.Format("Thanks for calling me with id: " + memId); 
    } 
</script> 
<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <asp:Button ID="MyButton" runat="server" Text="Submit" /> 
     <asp:TextBox ID="MyTextBox" runat="server" /> 
    </form> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
    <script type="text/javascript"> 
     $('#<%= MyButton.ClientID %>').click(function() { 
      var memId = $('#<%= MyTextBox.ClientID %>').val(); 
      $.ajax({ 
       url: '<%= ResolveUrl("~/Default.aspx/MyMethod") %>', 
       type: 'POST', 
       contentType: 'application/json; charset=utf-8', 
       data: JSON.stringify({ memId: memId }), 
       success: function (result) { 
        alert(result.d); 
       } 
      }); 
      return false; 
     }); 
    </script> 
</body> 
</html> 

爲示範的目的,它是一個自包含的WebForm,但你當然可以在後面的代碼從標記中分離出來。

0

通常我創建一個處理大多數客戶端 - 服務器Ajax交互的同樣的方式在下面的例子做了一個Ajax.aspx文件。然後這個頁面加載特定的控件。我有時會將一個function參數添加到ajax請求中,以訪問控件中的特定方法或直接在Ajax.aspx頁面上。

例子:
Simple ASP.net ajax framework