读书人

jquery+webservice兑现无刷新回复留言

发布时间: 2012-09-10 11:02:33 作者: rapoo

jquery+webservice实现无刷新回复留言,功能已经实现,但只有每页的第一行才能成功回复留言
<script type="text/javascript">
var pageNo = 1; //当前页号
var pageItems = 3; //每页显示的行数,这个数字与da.Fill(ds,pageNo,3,"gbook");里面的3保持一致
var MaxPage = pageItems;



function showPage(m) {
if (m == -1) {
if (pageNo < 2) {
alert("已经到了首页");
return;
};
MaxPage = pageItems;
}
else {
if (MaxPage < pageItems) {
alert("已经到了末页");
return;
};
}
pageNo += m;
getData();
}
$(document).ready(function () {
getData();
});
function getData() {
$.ajax({
type: "POST",
cache: false,
url: "WebService.asmx/Select", /* 注意后面的名字对应CS的方法名称 */
data: { "pageNo": (pageNo - 1) * pageItems }, /* 注意参数的格式和名称 */
contentType: "application/x-www-form-urlencoded",
dataType: "xml",
error: function (result) {
alert(result.responseText);
},
success: function (data) {
MaxPage = $(data).find('gbook').size();
t = "<table border='1'>";
$(data).find('gbook').each(function (index, ele) {
var id = $(ele).find('id').text();
var title = $(ele).find('title').text();
var name = $(ele).find('name').text();
var time = $(ele).find('time').text();
var content = $(ele).find('content').text();
var reptime = $(ele).find('reptime').text();
var repcontent = $(ele).find('repcontent').text();
t += "<tr>";
t += "<td>" + id + "</td>";
t += "<td>" + title + "</td>";
t += "<td>" + name + "</td>";
t += "<td>" + time + "</td>";
t += "<td>" + content + "</td>";
t += "<td>" + reptime + "</td>";
t += "<td>" + repcontent + "</td>";
t += "<td> <input type=button value='删除此留言' onclick='deleteData(" + id + ")'/></td><td><textarea id='TextArea1'></textarea><input type=button value='回复此留言' onclick='replyData(" + id + ")'/></td>";
//t += "<td> <input type=button value='删除此留言' onclick='deleteData(" + id + ")'/></td><td><input type=button value='回复此留言' onclick=='disp_alert()'/></td>";
t += "</tr>";
})
t += "</table>";


t += "<div><a href='' onclick='showPage(-1);return false;'>上一页</a> <a href='' onclick='showPage(1);return false;'>下一页</a></div>"
$("#result").html(t);
}
});
}

function deleteData(id) {
$.ajax({
type: "POST",
cache: false,
url: "WebService.asmx/Delete", /* 注意后面的名字对应CS的方法名称 */
data: { "id": id }, /* 注意参数的格式和名称 */
contentType: "application/x-www-form-urlencoded",
dataType: "xml",
success: function (ret) {

//判断 ret 删除成功再决定是否刷新getData();
getData();
}

});
}

function replyData(id) { //回复留言函数
var textarea1 = $("#TextArea1").val();
//alert("aa");
$.ajax({
type: "POST",
cache: false,
url: "WebService.asmx/Update", /* 注意后面的名字对应CS的方法名称 */

data: {"id":id,"textarea1":textarea1}, /* 注意参数的格式和名称 */
contentType: "application/x-www-form-urlencoded",
dataType: "xml",
success: function (ret) {
// ret = $(data).text();
//判断 ret 删除成功再决定是否刷新getData();
getData();
}

});
}



</script>





[WebMethod]
public System.Data.DataSet Select(int pageNo)
{
System.Data.SqlClient.SqlConnection sqlCon = new SqlConnection();
sqlCon.ConnectionString = "server=.;uid=sa;pwd=sa;database=guestbook";
//定义SQL语句
string SqlStr = "select * from gbook order by id desc";
//实例化SqlDataAdapter对象
SqlDataAdapter da = new SqlDataAdapter(SqlStr, sqlCon);
DataSet ds = new DataSet();
da.Fill(ds, pageNo, 3, "gbook");
return ds;
}


[WebMethod]
public String Delete(int id)
{
System.Data.SqlClient.SqlConnection sqlCon = new SqlConnection();
sqlCon.ConnectionString = "server=.;uid=sa;pwd=sa;database=guestbook";
//定义SQL语句
string SqlStr = "delete from gbook where id=" + id;
//实例化SqlDataAdapter对象
sqlCon.Open();
SqlCommand cmd = new SqlCommand(SqlStr,sqlCon);
int ret = cmd.ExecuteNonQuery();
sqlCon.Close();
if(ret > 0) return "删除成功";
return "删除失败";
}

//UPDATE Person SET FirstName = 'Fred' WHERE LastName = 'Wilson'

[WebMethod]
public String Update(int id, string textarea1)
{
System.Data.SqlClient.SqlConnection sqlCon = new SqlConnection();
sqlCon.ConnectionString = "server=.;uid=sa;pwd=sa;database=guestbook";
//定义SQL语句
//string SqlStr = "update gbook set repcontent='" + textarea1 + "' where id=" + id;
string SqlStr = string.Format("update gbook set repcontent='{0}' where id={1}", textarea1, id);
//实例化SqlDataAdapter对象
sqlCon.Open();


SqlCommand cmd = new SqlCommand(SqlStr, sqlCon);
int ret = cmd.ExecuteNonQuery();
sqlCon.Close();
if (ret > 0) return "回复成功";
return "回复失败";
}


jquery+webservice实现无刷新回复留言,功能已经实现,但只有每页的第一行才能成功回复留言,其他2行(我设置一页3行)点击【回复留言】按钮,没报错,却也没有插入任何数据,不知道是哪里错了,请指教。


[解决办法]
代码太多了,应该检主要写。或者简单表示出来。这样别人才能有心情帮你解答啊。
[解决办法]
查看一下是否都绑定了事件,或者有是不是都有ID(不重复)
[解决办法]
function replyData(id) { //回复留言函数
var textarea1 = $("#TextArea1").val();

-------------------------------------------^
$("#TextArea1").val()获认都是获取的第一个ID

所以我们要做个标识

<textarea id='TextArea1"+id+"' 比如这样

下面代码写成
function replyData(id) { //回复留言函数
var textarea1 = $("#TextArea1"+id).val();

^__^楼主的分好像挺好拿的

读书人网 >asp.net

热点推荐