jquery - 无法使用ajax和linq将数据保存到数据库

Question

这是我的 listview.aspx 文件，具有 AJAX 功能和 listview Controller 。我无法保存此数据:

$(function () {
    var firstname = $('#fname').val();
    var lastname = $('#lanme').val();
    var education = $('#education').val();
    var email = $('#email').val();
    $('#submit').click(function () {
        $.ajax({
            url: 'listview.aspx/Insert_data',
            data: "{ 'First' : '" + firstname + "' , 'Last' : '" + lastname + "' , 'education' : '" + education + "' , 'Email' : '" + email + "'  }",
            type: 'POST',
            async: false,
            success: function (response) {                        
                $('#fname').val('');
                $('#lanme').val('');
                $('#education').val('');
                $('#email').val('');
                alert('saved..');
            },
            error: function () {
                alert("Error");
            }
        })
    })
})

对于以下列表控件:

<table>
    <tr>
        <td>FirstName:</td>
        <td><input type="text" id="fname" /></td>
    </tr>
    <tr>
        <td>Last:</td>
        <td><input type="text" id="lname" /></td>
    </tr>
    <tr>
        <td>Education:</td>
        <td><input type="text" id="education" /></td>
    </tr>
    <tr>
        <td>Email:</td>
        <td><input type="text" id="email" /></td>
    </tr>
    <tr>
        <td></td>
        <td><input type="submit" id="submit" value="Submit" /></td>
    </tr>
</table>
</div>
<div>
    <asp:ListView ID="lv1" runat="server">
     <LayoutTemplate>
         <table id="tbl1">
             <tr>
                 <th>ID</th>
                 <th>FirstName</th>
                 <th>LastName</th>
                 <th>Education</th>
                 <th>Email</th>
             </tr> 
             <tbody>
                 <asp:PlaceHolder ID="itemPlaceHolder" runat="server"></asp:PlaceHolder>
             </tbody>                
         </table>
     </LayoutTemplate>
        <ItemTemplate>
            <tr>
            <td><%# Eval("Id") %></td>
            <td><%# Eval("First") %></td>
            <td><%# Eval("Last") %></td>
            <td><%# Eval("education") %></td>
            <td><%# Eval("Email") %></td>
            </tr>
        </ItemTemplate>
    </asp:ListView>
</div>

这是我在 listview.aspx.cs 文件中的方法:

[WebMethod(enableSession: true)]
    public static bool Insert_data(string fname,string lname, string edu, string email)
    {
        databaseDataContext db = new databaseDataContext();
        db.Connection.ConnectionString = ConfigurationManager.AppSettings["dbConnect"];
        //tbl_employee tbl = new tbl_employee()
        //{
        //    First = fname,
        //    Last = lname,
        //    education = edu,
        //    Email = email
        //};
        tbl_employee tbl = new tbl_employee();
        tbl.First = @firstname;
        db.tbl_employees.InsertOnSubmit(tbl);
        db.SubmitChanges();
        return true;
    }
}

当我提交保存数​​据的表单时，它会显示一条警告，提示数据已按照我在 AJAX 函数中编写的方式保存，但实际上并非如此。

Answer 1

您是否尝试过更改 Insert_data 函数，使其具有与从 Ajax 调用传递的相同输入参数。

您的方法签名是:

public static bool Insert_data(string fname,string lname, string edu, string email)

但是您的 Ajax 调用正在传递:

data: "{ 'First' : '" + firstname + "' , 'Last' : '" + lastname + "' , 'education' : '" + education + "' , 'Email' : '" + email + "'  }",

您没有阻止提交按钮操作。更改您的代码:

$('#submit').click(function(e) {

    // Prevent page postback.
    e.preventDefault();

    // Ajax code here

});

最后，我更喜欢传递一个对象，而不是传递大量参数，因为它允许轻松维护代码。您可以更改正在使用的字符串参数并替换为对象。

可以在 JavaScript 中设置对象:

var mFormData = {
  FirstName: firstname,
  LastName: lastname,
  Education: education,
  Email: email
};

然后您可以通过 Ajax 调用数据属性传递此信息:

data: JSON.stringify(mFormData)