Question

我想使用json插入我的数据。这是我的代码

<head id="Head1" runat="server">
    <title>Register</title>
    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
   <script type="text/javascript" src="js/MyJs.js" ></script>
</head>

<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>Name : </td>
                <td>
                   <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>Password : </td>
                <td>
                   <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>                
                <td colspan="2">
                    <asp:Button ID="Button1" runat="server" Text="SUBMIT" /><br />
                    <div id="loadingPanel" style="color:green; font-weight:bold;display:none;">Data Saving...</div>
                    <asp:Label runat="server" ID="lbl" Visible="false" Text="chk"></asp:Label>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

我的jquery代码是。

$(document).ready(function () {
    $('#Button1').on('click', function () {
        var uname = $('#TextBox1').val();
        var upass = $('#TextBox2').val();
        $('#loadingPanel').show();
        $.ajax({
            url: "Default.aspx/SaveData",
            type: "POST",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({
                "name": uname,
                "pass": upass
            }),
            success: function (data) {
                if (data.d == "success") {
                    alert("Data saved successfully");                    
                }
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(thrownError);
            }
        }).done(function () {
            // here hide loading panel as function complete
            $('#loadingPanel').hide();
        });
    });
});

代码背后的代码是

[WebMethod]
    public static string SaveData(string name,string pass)
    {
        string str = ConfigurationManager.ConnectionStrings["connect"].ConnectionString;
        string status = string.Empty;
        SqlConnection con = new SqlConnection(str);
        con.Open();
        SqlCommand cmd = new SqlCommand("insert into Login values ('"+name+"','"+pass+"')",con);
        int flag = cmd.ExecuteNonQuery();

        if (flag > 0)
        {

            status = "success";
        }

        return status;
    }

但是当我点击提交按钮时，它不会插入数据。它只是刷新页面。并且它没有显示任何错误。

Answer 1

您已将方法名称作为大写字符

$.Ajax({...

您应该用

替换它

$.ajax({...

并从click事件返回false，以防止页面回发。

Answer 2

当你不需要服务器端事件时，不要使用asp：按钮。只需使用简单的html按钮或输入类型按钮进行onclick事件。

如果您决定使用html按钮，请记住，旧的IE版本也需要分配一种按钮。如果您不这样做，那么旧版本的IE将始终提交表格。

<button type="button" value="SUBMIT" onclick="whatever" />

Answer 3

替换你的按钮代码

 <input type="button" id="Button1" value="sub" />

这里是jquery代码

$(document).ready(function () {
    $('#Button1').on('click', function () {
        var uname = $('#TextBox1').val();
        var upass = $('#TextBox2').val();
        call(uname, upass);

    });
});

function call(uname, upass) {
    $.ajax({
        type: "POST",
        url: "Default.aspx/SaveData",
        data: "{name : '" + uname + "', pass: '" + upass + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",       
        success: function (v) {
            alert("OK");
        },
        error: function (v) {
            alert("error");
        }
    });
}

无法使用json在数据库中插入数据

3 个答案: