如何通过jquery使用ajax调用webform的函数?

时间:2014-12-05 11:42:08

标签: javascript c# jquery asp.net

我想调用一个函数来改变WebForm1中名为“firstdivision”的分区的文本框中的值,通过jquery和ajax。 这是我写的代码,但它不起作用:

<asp:ScriptManager ID="scriptmanager" runat="server" EnableCdn="true" AjaxFrameworkMode="Disabled">
    <Scripts>
        <asp:ScriptReference Path="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"/>
    </Scripts>
    </asp:ScriptManager>

    <script type="text/javascript" lang="javascript">

        var pageurl = '<%=ResolveUrl("~/WebForm1.aspx/Search()") %>';
        var srch = $("#<%=list_Search.Text%>");
        var name = $("#<%=txt_Name.Text%>");
        var empID = $("#<%=txt_EmpID.Text%>");
        var address = $("#<%=txt_Address.Text%>");
        var email = $("#<%=txt_Email.Text%>");
        var phone = $("#<%=txt_Phone.Text%>");
        var salary = $("#<%=txt_Salary.Text%>");
        var dob = $("#<%=txt_DOB.Text%>");
        var natinality = $("#<%=txt_Nationality.Text%>");

        $('document').ready
        (
            function ()
            {
                $("#btn_Search").click
                (
                    function (e)
                    {
                        e.preventDefault();
                        $.ajax
                        (
                          {
                              type : 'POST',
                              URL: pageurl,
                              async: "true",
                              //data: srch,
                              //contentType: "application/json; charset=utf-8",
                              //dataType: "json",
                              success: function (x) 
                                          { 
                                              alert("Done Successfully with " + x.msg);
                                          },
                              error: function (e) { alert("The call got failed due to " + e.msg); }                                 
                          }                             
                        );
                        $("#firstDivision").html("").append(data);
                    }
                );
            }
        )

        //function dotask()
        //{
        //    employee_db.WebForm1.Search();
        //    return true;
        //}

    </script>

        
        

这是我正在调用的函数的代码:

[WebMethod]
    public static void Search()
    {
        //string search,string name,int empID,string address,string email,double phone,double salary,DateTime dob,string nationality
        string constr = ConfigurationManager.ConnectionStrings["myconnectionstring"].ConnectionString;
        SqlConnection myconnection = new SqlConnection(constr);
        myconnection.Open();

        WebForm1 test = new WebForm1();
        test.conc(myconnection);
        //conc(myconnection);

        myconnection.Close();
    }

    protected void conc(SqlConnection myconnection)
    {
        string search = list_Search.Text; 
        SqlDataReader reader;

        if(string.Compare(search,"Search By Name",true)==0)
        {
            SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Name='" + txt_Name.Text + "'", myconnection);
             reader= myCommand.ExecuteReader();
        }

        else if (string.Compare(search, "Search By Employee ID", true) == 0)
        {
                SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Employee_ID='" + txt_EmpID + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        else if (string.Compare(search, "Search By Address", true) == 0)
        {
                SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Address='" + txt_Address + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        else if (string.Compare(search, "Search By Phone No", true) == 0)
        {
                SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Phone='" + txt_Phone + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        else if (string.Compare(search, "Search By Email", true) == 0)
        {
                SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Email='" + txt_Email + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        else if (string.Compare(search, "Search By Salary", true) == 0)
        {
                SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Salary='" + txt_Salary + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        else if (string.Compare(search, "Search By Date Of Birth", true) == 0)
        {
            SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Date_of_Birth='" + txt_DOB + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        else
        {
            SqlCommand myCommand = new SqlCommand("SELECT * FROM Emp_Details WHERE Nationality='" + txt_Nationality + "'", myconnection);
            reader= myCommand.ExecuteReader();
        }

        try
        {
            DataTable dt = new DataTable();

            if (!reader.Read())
                return;     

            txt_Name.Text = reader["Name"].ToString();
            txt_EmpID.Text = reader["Employee_ID"].ToString();
            txt_Address.Text = reader["Address"].ToString();
            txt_Phone.Text = reader["Phone"].ToString();
            txt_Salary.Text = reader["Salary"].ToString();
            txt_Email.Text = reader["Email"].ToString();
            txt_DOB.Text = reader["Date_Of_Birth"].ToString();
            txt_Nationality.Text = reader["Nationality"].ToString();
        }
        catch (Exception ex)
        {
            throw ex;
        }
    }

现在我没有收到任何错误,但我想刷新包含所有那些文本框的分区“第一分部”,现在显示通过搜索功能通过数据库搜索的新数据

3 个答案:

答案 0 :(得分:0)

从网址和#

删除.cs
$("#firstDivision").load
                    (
                      {
                          url: "WebForm1.aspx/Search",
                          async: "true",
                          success: function (msg) { alert("Done Successfully"); },
                          error: function (x, e) { alert("The call got failed due to " + x.msg); }
                      }
                    );

答案 1 :(得分:0)

的onclick =&#34;的javascript:搜索()&#34;在您的HTML中可能会使它复杂化。

尝试下面的代码,让我们知道它是怎么回事;

                  

<script type="text/javascript">

    $('document').ready
    (
        function ()
        {
            $("#btn_Search").click
            (
                function (e)
                {
                    e.preventDefault();
                    $("#firstDivision").load
                    (
                      {
                          checkURL: "WebForm1.aspx.cs/#Search",
                          async: "true",
                          success: function (msg) { alert("Done Successfully"); },
                          error: function (x, e) { alert("The call got failed due to " + x.msg); }
                      }
                    );
                }
            );
        }
    )

</script>

    <input id="btn_Search" type="button" value="Search" />


<br />

答案 2 :(得分:0)

好的,首先是第一件事 - 语法不好(尤其是#34;函数...... ......().....等等, 这段代码应该有效(使用JSfiddle http://jsfiddle.net/ajynnoff/)我必须硬编码$("#firstDivision").text("this should come from ajax - just simulating here");,但我认为你会得到这张照片。

$('document').ready(function () {
     $("#btn_Search").click(function (e) {
         e.preventDefault();
         console.log("clicked");
         $("#firstDivision").load("/echo/html/", function (response, status, xhr) {
             if (status == "error") {
                 var msg = "Sorry but there was an error: ";
                 $("#ajax_status").html(msg + xhr.status + " " + xhr.statusText);
             } else if (status == "success") {
                 var msg = "Success: ";
                 $("#ajax_status").html(msg + xhr.status + " " + xhr.statusText);


                 $("#firstDivision").text("this should come from ajax - just simulating here");

             }
         });
     });
 });

我个人会使用&#34; pure&#34; ajax http://api.jquery.com/jquery.ajax/用于开始,结束,错误等而不是加载 - 以获得最佳部分:)