Question

我试图在点击按钮时使用外部JavaScript调用aspx.cs函数。

这是aspx

<head runat="server">
    <title></title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="<%= ResolveUrl ("~/Scripts/lookup.js") %>"></script>
</head>
<body>

        <section class="webdesigntuts-workshop">
            <asp:ScriptManager ID='ScriptManager1' runat='server' EnablePageMethods='true' />
    <form id="form1" runat="server">            
        <asp:TextBox type="search" name="search" id="sform" placeholder="What are you looking for?" runat="server" />       
         <asp:TextBox type="search" name="hdnText" id="hdnText" runat="server" />

        <button id="Button1"  runat="server" onclientclick="lookup();return false;">Search</button>
    </form>
</section>

</body>

这是我的javascript lookup.js，它放在Scripts文件夹中。

function Signup() {
    var query = document.getElementById('<%=sform.ClientID %>').value;


    PageMethods.lookupfromjs_Click(query);

    function onSucess(result) {
        alert(result);
    }

    function onError(result) {
        alert('Cannot process your request at the moment, please try later.');
    }
}

这是aspx.cs函数。

protected void lookupfromjs_Click(String query)
        {

            if (!String.IsNullOrEmpty(query))
            {
                hdnText.Text = "query= " + query + " look up number " + lookup_no++;

                // sform.Text= "You are looking up the term " + query;

            }
        }

在VS或浏览器中没有这样的错误。但我在浏览器中的断点似乎没有起作用。浏览器正确加载了java脚本。然而，按钮点击似乎没有任何事情发生。

任何帮助都将不胜感激。

Answer 1

如果您使用的是.aspx个文件，那么您使用的是webforms框架。如果你使用webforms，那么在这里做的正常事情就是在代码隐藏页面中有一个带有事件处理程序的<asp:Button runat="server" ...></asp:Button>。如果你想避免使用postbacks，那么你使用了错误的框架。

也就是说，当然有一种情况是回帖不必要，你只想在服务器上运行一个很小的代码片段。然后可以使用页面方法。

为了使代码中的方法可用作page method，该方法必须：

使用[WebMethod]属性 - System.Web.Services.WebMethod
声明为public static

请注意，页面方法无法使用页面上的控件。使用ajax请求调用页面方法。没有完整的页面生成。在方法返回后，必须使用javascript对使用页面方法的页面进行任何更新。

您的代码中至少存在一些不同的明显错误：

您拨打lookup(); return false;但javascript方法名为Signup
您的<%=sform.ClientID %>文件中有lookup.js。但是该文件是使用<script ... ></script>标记引入的，该标记是浏览器的单独请求，由静态处理程序处理。因此<%=sform.ClientID %>将无法解决。
您的所谓的 Web方法未正确定义，和它尝试使用页面中的控件，就好像它是一个回发事件处理程序。
等

工作样本（适合我）：

网络表单：

<head runat="server">
    <title></title>
    <script type="text/javascript" src="<%= ResolveUrl("~/Scripts/lookup.js") %>"></script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"
            EnablePageMethods="true">
        </asp:ScriptManager>
        <asp:TextBox type="search" name="search" ID="sform" placeholder="What are you looking for?" runat="server" />
        <asp:TextBox type="search" name="hdnText" ID="hdnText" runat="server" />
        <button id="Button1" onclick="Signup('<%= sform.ClientID %>', '<%= hdnText.ClientID %>');">Search</button>
    </form>
</body>

JavaScript的：

function Signup(sformId, hdnId) {
    var query = document.getElementById(sformId).value;
    var res = PageMethods.lookupfromjs_Click(query, onSucess, onError);
    function onSucess(result) {
        document.getElementById(hdnId).value = result;
        alert(result);

    }
    function onError(result) {
        alert('Cannot process your request at the moment, please try later.');
    }
}

页面方法：

[System.Web.Services.WebMethod]
public static string lookupfromjs_Click(String query)
{
    return "query was " + HttpUtility.UrlEncode(query);
}

使用外部js调用aspx.cs函数（按下按钮）

1 个答案: