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

Question

这是我的listview.aspx文件，它具有AJAX功能和listview控制器。我也救不了这样的数据：

$(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)