تبليغاتX
کدهای آماده ASP.NET - انتخاب/عدم انتخاب همه سطرهای اطلاعاتی با جاوا اسکریپت و سی شارپ

بعضی وقتا گذاشتن یه CheckBox برای کاربرا که بتونن همه CheckBox های توی یه لیست رو تیک بزنن (مثل یاهو یا gmail) مشتری ها رو خیلی خوشحال می کنه. اگه از کنترل های ASP مثل GridView استفاده می کنید و نمی دونید چطوری بدون PostBack شدن صفحه و فقط با کد های JavaScript پس جای درستی اومدید :D اصلا هم مهم نیست که دارید از MasterPage، AJAX، UserControl یا هر چیز دیگه ای استفاده می کنید یا نه. این کد به هر حال درست کار می کنه

اول یه ستون از نوع Template اضافه کنید که توش یه دونه کنترل CheckBox باشه. این طوری کاربر کنار هر رکورد اطلاعاتی می تونه یه تیک بزنه. برای همین ستون یه Header هم تعریف کنید که توش یه CheckBox باشه. کاربر می خواد با زدن این تیک، همه گزینه ها رو انتخاب کنه (Select All/UnSelect All)

<HeaderTemplate>

<asp:CheckBox ID="chkSelectAll" runat="server" AutoPostBack="false"/>

HeaderTemplate>

<ItemTemplate>

<asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="false" />

ItemTemplate>

حالا می خوایم کاری کنیم که با کلیک روی chkSelectAll یه کد جاوا اجرا بشه. این کار باید RunTime انجام بشه. یعنی بعد از اینکه یه Id به صورت ClientSide برای chkSelectAll ایجاد شد. (البته یه پیش بینی هایی هم می شه کرد. _ctl_chkSelectAll) حالا باید کد رو برا صدا زدن تابع جاوا اضافه کنیم

if ((e.Row.RowType == DataControlRowType.Header))

{

((CheckBox)e.Row.FindControl("chkSelectAll")).Attributes.Add("onclick", "javascript:ToggleSelect ('" + ((CheckBox)e.Row.FindControl("chkSelectAll")).ClientID + "')");

}

این کد باعث می شه که اگه کاربر روی CheckBox روی Header کلیک کرد (شرط if(e.Row…)) تابع جاوا به اسم ToggleSelect صدا زده بشه و Id ایجاد شده برای این کنترل هم به تابع پاس داده می شه. تابع جاوا هم باید به صفحه اضافه بشه.

<script type="text/javascript">

function ToggleSelect(id)

{

var frm = document.forms[0];

for (i=0;i

{

if (frm.elements[i].type == "checkbox")

{

frm.elements[i].checked = document.getElementById(id).checked;

}

}

}

script>

این اسکریپت ساده جاوا برای هر دو حالت درست کار می کنه. یعنی تمام CheckBox های دیگه رو شبیه به Header می کنه. اگه کاربر Header رو تیک بزنه همه تیک می خورن و برعکس.
نوشته شده توسط حميد دارابي در پنجشنبه بیست و یکم شهریور 1387 |