JavaScript, Page Method, and Gridview
JavaScript, Page Method, and Gridview
我现在知道如何在JavaScript和ASP.Net（VB.Net）中使用page方法，但它只限制我使用单个插入。我的问题是，当我将在网格视图中大量插入到数据库中的列项目时。它不起作用，不幸的是，它没有说任何错误。这是我迄今为止拥有的：
服务器端代码（VB）
<WebMethod()> _
<ScriptMethod()> _
Public Shared Sub SavetoDB(ByVal ans As Answers)
Dim constr As String = ConfigurationManager.ConnectionStrings("CCQTConnectionString").ConnectionString
Using con As New SqlConnection(constr)
Using cmd As New SqlCommand("INSERT INTO tblApplicantAns (Appnr, QID, answer) VALUES(@Appnr, @QID, @ans)")
cmd.CommandType = CommandType.Text
cmd.Parameters.AddWithValue("@Appnr", ans.appnr)
cmd.Parameters.AddWithValue("@QID", ans.qid)
cmd.Parameters.AddWithValue("@ans", ans.ans)
cmd.Connection = con
con.Open()
cmd.ExecuteNonQuery()
con.Close()
End Using
End Using
End Sub
Public Class Answers
Public Property qid() As String
Get
Return _qid
End Get
Set(ByVal value As String)
_qid = value
End Set
End Property
Private _qid As String
Public Property ans() As String
Get
Return _ans
End Get
Set(ByVal value As String)
_ans = value
End Set
End Property
Private _ans As String
Public Property appnr() As String
Get
Return _appnr
End Get
Set(ByVal value As String)
_appnr = value
End Set
End Property
Private _appnr As String
JavaScript（AJAX）
$(function () {
var gvDrv = document.getElementById("<%= grdQ.ClientID %>");
for (i=1; i<gvDrv.rows.length; i++)
{
var cell = gvDrv.rows[i].cells;
var q = cell[0].innerHTML;
var a = cell[1].innerHTML;
$("[id*=Button1]").bind("click", function () {
var ans = {};
ans.appnr = $("[id*=TextBox1]").val();
ans.qid = $(" + q + ").val();
ans.ans = $(" + a + ").val();
$.ajax({
type: "POST",
url: "English.aspx/SavetoDB",
data: '{ans: ' + JSON.stringify(ans) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("Time is up! Exam will proceed to next module.");
window.location = "Conf_English.aspx";
}
});
return false;
});
});
}
由于整个网格只有一个保存按钮，因此客户端脚本逻辑向后。您将希望在按钮的点击事件处理程序中循环遍历网格的每一行，而不是反过来；像这样：
$(document).ready(function() {
$("[id*=Button1]").bind("click", function() {
var gvDrv = document.getElementById("<%= grdQ.ClientID %>");
for (i = 1; i < gvDrv.rows.length; i++) {
var cell = gvDrv.rows[i].cells;
var q = cell[0].innerHTML;
var a = cell[1].innerHTML;
var ans = {};
ans.appnr = $("[id*=TextBox1]").val();
ans.qid = $(" + q + ").val();
ans.ans = $(" + a + ").val();
$.ajax({
type: "POST",
url: "English.aspx/SavetoDB",
data: '{ans: ' + JSON.stringify(ans) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("Time is up! Exam will proceed to next module.");
window.location = "Conf_English.aspx";
}
});
}
return false;
});
});
现在，您不需要为网格中的每一行调用页面方法，而是需要向服务器端ASP.NET AJAX页面方法传递一个值数组，而不是单个值。为了利用您已经定义的Answers类，我们可以构建一个对象的JavaScript数组，这些对象的属性值与您在类中的属性名称相匹配（即qid、ans等）；像这样：
$(document).ready(function() {
$("[id*=Button1]").bind("click", function() {
var gvDrv = document.getElementById("<%= grdQ.ClientID %>");
// Create array to hold x number of Answers instances
var answers = new Array();
// Loop through rows of grid
for (i = 1; i < gvDrv.rows.length; i++) {
var cell = gvDrv.rows[i].cells;
var q = cell[0].innerHTML;
var a = cell[1].innerHTML;
// Build one answer object per row
var ans = {};
ans.appnr = $("[id*=TextBox1]").val();
ans.qid = $(" + q + ").val();
ans.ans = $(" + a + ").val();
// Add single answer to array of answer objects
answers.push(ans);
}
// Make one call to ASP.NET AJAX Page Method passing in array of answer values
$.ajax({
type: "POST",
url: "English.aspx/SavetoDB",
data: '{ans: ' + JSON.stringify(answers) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("Time is up! Exam will proceed to next module.");
window.location = "Conf_English.aspx";
}
});
return false;
});
});
最后，在ASP.NET AJAX页面方法的服务器端，您需要处理一个Answers对象列表，而不是一个单独的Answers对象，如下所示：
<WebMethod()> _
<ScriptMethod()> _
Public Shared Sub SavetoDB(ByVal ans As List(Of Answers))
Dim constr As String = ConfigurationManager.ConnectionStrings("CCQTConnectionString").ConnectionString
' Loop through each Answers object here
For Each answer As Answers In ans
Using con As New SqlConnection(constr)
Using cmd As New SqlCommand("INSERT INTO tblApplicantAns (Appnr, QID, answer) VALUES(@Appnr, @QID, @ans)")
cmd.CommandType = CommandType.Text
cmd.Parameters.AddWithValue("@Appnr", answer.appnr)
cmd.Parameters.AddWithValue("@QID", answer.qid)
cmd.Parameters.AddWithValue("@ans", answer.ans)
cmd.Connection = con
con.Open()
cmd.ExecuteNonQuery()
con.Close()
End Using
End Using
Next
End Sub
相关文章：
- ExtJS 5用程序点击actioncolumn gridview
- Selenium WebDriver and JavaScript change
- 选择不在GridView-ASP.NET中激发
- 如何使用javascript函数在gridview中按行启用/禁用复选框
- PHP and Javascript functions
- Javascript Return and if/else
- SetTimeout and clearTimeout in Javascript
- lightbox in html 5 and javascript
- TimelineJS and AngularJS
- timeago.js with datatable and PHP
- javascript button ajax and php
- Ajax and Json with Rails
- Combine onload, onresize and onclick
- php布尔值's小写AND大写和数字布尔值'可以接受
- Gridview ImageButton更改mouseover和mouseout上的图像
- setTimeout and V8
- 使用JavaScript获取Gridview单元格值
- Jquery post and onclick
- 在GridView中，当单击复选框时，在网格的同一行中使用JavaScript将标签中的值添加到TextBox
- JavaScript, Page Method, and Gridview
