天天看點

ASP.NET資料清單“全選”,批量處理的JS實作

jquery1.3.2中的方法為:

//全部選中全部取消處理

function CheckTrue(obj)

{

$("input[@type=checkbox][name=checkItem]").attr("checked",$(obj).attr("checked"));

}

//收集被選中的項

function CollectCheckItems()

{

var allcheckboxs=$("input[@type=checkbox][name=checkItem][checked]");

var ids=new StringBuilder();

for(var i=0;i<allcheckboxs.length;i++)

{

var id=$(allcheckboxs[i]).attr("id").split("_")[1];

ids.Append(id)

ids.Append(",");

}

var strIds=ids.ToString();

return strIds.substr(0,strIds.length-1);

}

關于StringBuilder 見本文最後部分。

全選框的HTML:

<input type="checkbox" id='checkAll' name='checkAll' οnclick='CheckTrue(this)' />全選

單行資料中的選擇框的HTML:

<input type="checkbox" id="checkItem_<%=item.productid%>" name='checkItem' />

該方法的特點是生成的清單HTML中,選擇框的id值都為"checkItem_"+id,name為"checkItem"。

以上腳本的方法就是通過選擇框的id獲得資料清單中該行資料的ID。

jquery1.2.6中的方法為:

//全部選中全部取消處理

function CheckTrue(obj)

{

$("input[@type=checkbox][@name=checkItem]").attr("checked",$(obj).attr("checked"));

}

//收集被選中的項

function CollectCheckItems()

{

var allcheckboxs=$("input[@type=checkbox][@name=checkItem][checked]");

var ids=new StringBuilder();

for(var i=0;i<allcheckboxs.length;i++)

{

var id=$(allcheckboxs[i]).attr("id").split("_")[1];

ids.Append(id)

ids.Append(",");

}

var strIds=ids.ToString();

return strIds.substr(0,strIds.length-1);

}

在Jquery1.3.2版使用該方法會報錯: “Microsoft JScript 運作時錯誤: 例外被抛出且未被接住”,

定位到 “ throw "Syntax error, unrecognized expression: " + expr;”代碼

原因: JQuery1.3.2版,“name”屬性前不用加“@”符号。 例如:

$("input[@type=radio][name=checkItem][checked]")

批量删除的方法:

//删除選中俱樂部資訊

function DeleteCompanyInfos()

{

if(!window.confirm("确定要删除您選擇的資料項嗎?"))

{

return;

}

var checkedItems=CollectCheckItems();

if(checkedItems=="")

{

alert("請選擇要删除的客戶!");

return;

}

$("#divGridView").html("<ul> <li> 正在嘗試删除資料...</li> </ul>");

$.ajax(

{

type:'POST',

url:'ManageAbout.aspx',

dataType:'text',

data:{Action:'delete',CompanyInfoIDs:checkedItems},

cache:false,

success:DeleteCompanyInfosCallBack

}

);

}

//删除選中俱樂部資訊回調函數

function DeleteCompanyInfosCallBack(r)

{

if(r=="0")

{

alert("删除成功!");

}

else

{

alert("删除失敗!");

}

LoadCompanyInfoList();

}

ManageAbout.aspx頁面的Page_Load中是這樣接收參數進行批量删除的。

//删除資料

if (action == "delete")

{

string strId = Request["CompanyInfoIDs"];

if (strId != null)

{

if (DeleteCompanyInfo(strId))

{

returnValue = "0";

}

else

{

returnValue = "1";

}

}

else

{

returnValue = "1";

}

//向用戶端發送資料

Response.Clear();

Response.Expires = 0;

Response.ContentType = "application/xml";

Response.Write(returnValue);

Response.End();

}

其中DeleteCompanyInfo為ManageAbout.aspx.cs中的一個方法,調用的是BLL中的資料處理方法。

這種批量處理的方法在ASP.NET MVC中則隻需将id字元串傳給一個帶接收id字元串參數(string類型)的Action既可,Action中則根據獲得的id調用資料處理層的删除方法。

上文JS中的StringBuilder方法,是引用的一個JS檔案中的方法,代碼如下:

// 用來連接配接字元串,提高字元串的拼接速度

function StringBuilder()

{

this.buffer = new Array();

}

StringBuilder.prototype.Append = function Append(string)

{

if ((string ==null) || (typeof(string)=='undefined'))

return;

if ((typeof(string)=='string') && (string.length == 0))

return;

this.buffer.push(string);

};

StringBuilder.prototype.AppendLine = function AppendLine(string)

{

this.Append(string);

this.buffer.push("/r/n");

};

StringBuilder.prototype.Clear = function Clear()

{

if (this.buffer.length >0 ){

this.buffer.splice(0,this.buffer.length);

}

};

StringBuilder.prototype.IsEmpty = function IsEmpty()

{

// return (this.buffer.length == 0);

};

StringBuilder.prototype.ToString = function ToString()

{

return this.buffer.join("");

};

//處理日期字元串

function FormatDateType(date)

{

if(date)

{

return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate();

}

else

{

return "";

}

}

之前1.3.2版本的JS中,$("input[@type=radio][name=checkItem][checked]")寫成$("input[type=radio][name=checkItem][checked]")了,導緻在火狐中無效。

因為type前沒加“@”,現已更正。 

繼續閱讀