توضیحات و دانلود

استفاده از CheckBoxList مانند RadioButtonList در ASP.Net
0 0
استفاده از CheckBoxList مانند RadioButtonList در ASP.Net

با سلام در این مقاله  با ذکر مثال توضیح خواهم داد که چطور CheckBoxList را به طور متقابل منحصر به فرد می سازد . یعنی آن را شبیه به RadioButtonList که در آن کاربر می تواند تنها یک مورد (گزینه) را از لیست اقلام (گزینه ها) انتخاب کند . در عین حال ممکن است CheckBoxList را چک کنید که در مورد RadioButtonList امکان پذیر نیست.
کنترل های RadioButtons ASP.Net و RadioButtonList کنترل اختیاری متقابل را فراهم می کنند، یعنی می توان تنها یک مورد از N را انتخاب کرد، اگر عنصر دیگری انتخاب شود،  علامت قبلی حذف می شود.
مشکل RadioButtons و RadioButtonList کنترل این است که یک بار در گروه RadioButtons بررسی می شود و پس از آن نمیتوان بدون علامت چک کرد، یعنی زمانی که همه آنها بدون علامت چک شوند، امکان بازگشت وجود ندارد.
بنابراین وقتی ASP.Net CheckBox یا CheckBoxList کنترل ها با استفاده از جاوااسکریپت متقابلا ایجاد می شوند، توابع زیر امکان پذیر میشود.
1. کاربر می تواند تنها یک مورد (گزینه) را انتخاب کند.
2. کاربر همچنین می تواند انتخاب خود را برداشت و تمام CheckBoxes خالی را ترک کند.
منحصر به فرد کردن CheckBox با تابع جاوا اسکریپت
تابع جاوا اسکریپت زیر Accepts CheckBox که به عنوان مرجع کلیک شده است. با استفاده از مرجع CheckBox، جدول مرجع تعیین می شود و تمامی CheckBoxes موجود در جدول آورده شده است.
سپس یک حلقه بر روی تمامی CheckBoxes داخل CheckBoxList اجرا می شود و تمام CheckBox های دیگر بدون کنترل می شوند.

<script type="text/javascript">
    function MutExChkList(chk) {
        var chkList = chk.parentNode.parentNode.parentNode;
        var chks = chkList.getElementsByTagName("input");
        for (var i = 0; i < chks.length; i++) {
            if (chks[i] != chk && chk.checked) {
                chks[i].checked = false;
            }
        }
    }
</script>

وقتی که  CheckBoxes را کلیک می کنید، عملکرد جاوا اسکریپت را فراخوانی می کنید
وقتی CheckBox روی آن کلیک می شود، دو راه برای فراخوانی عملکرد جاوا اسکریپت وجود دارد.
1. روش مستقیم
ساده ترین راه برای تنظیم جاوا اسکریپت OnClick  به ListItem CheckBoxList است همانطور که در زیر نشان داده شده است. اگر چه این روش کار می کند، اما هشدارهای ویژوال استودیویی را ایجاد می کند که ممکن است به برخی از کاربران آسیب برساند و از این رو اگر شما این روش را دوست ندارید، می توانید از روش دوم استفاده کنید.

<asp:CheckBoxList ID="CheckBoxList1" runat="server">
    <asp:ListItem Text="Mango" Value="1" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Apple" Value="2" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Banana" Value="3" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Guava" Value="4" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Orange" Value="5" onclick="MutExChkList(this);" />
</asp:CheckBoxList>

2.روش Code Behind
در این روش، پردازنده رویداد جاوا اسکریپت OnClick در Code Behind قرار داده شده است. یک حلقه بر روی اقلام CheckBoxList اجرا  و دستیار رویداد JavaScript OnClick تنظیم می شود.

<asp:CheckBoxList ID="CheckBoxList1" runat="server">
    <asp:ListItem Text="Mango" Value="1" />
    <asp:ListItem Text="Apple" Value="2" />
    <asp:ListItem Text="Banana" Value="3" />
    <asp:ListItem Text="Guava" Value="4" />
    <asp:ListItem Text="Orange" Value="5" />
</asp:CheckBoxList>

C #

protected void Page_Load(object sender, EventArgs e)
{
    for (int i = 0; i < CheckBoxList1.Items.Count; i++)
    {
        CheckBoxList1.Items[i].Attributes.Add("onclick", "MutExChkList(this)");
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    For i As Integer = 0 To CheckBoxList1.Items.Count - 1
        CheckBoxList1.Items(i).Attributes.Add("onclick", "MutExChkList(this)")
    Next
End Sub

 


دانلود
  • لینک های دانلود دوره های آموزشی تا پایان دوره قابل دانلود می باشد.
  • برای خارج کردن فایل ها از حالت فشرده از ورژن جدید نرم افزار winrar استفاده کنید.
  • برای خارج کردن فایل ها از حالت فشرده لینک های دانلودی که چندین قسمت می باشند فقط قسمت اول را از حالت فشرده خارج کنید.
  • لطفا توضیحات نوشته شده برای مطالب را با دقت بخوانید.
  • برای نمایش فیلم ها می توانید از نرم افزار هایی مانند Km Player , VLC Player یا Media Player Classic استفاده کنید.

ارسال نظر
ارسال پیام به :