Hi thanks for your helpASPNet DropDownCheckBoxes Change default select text in jQueryBut something went wrong when i have more than 1 dropdwoncheckboxeslthtml xmlns34httpwwww3org1999xhtml34gtlthead runat34server34gt lttitlegtlttitlegt ltscript type34textjavascript34 src34httpscdnjscloudflarecomajaxlibsjquery371jqueryminjs34gtltscriptgt ltscript type34textjavascript34gt function

Hi counterkinFor changing the SelectAll text you need to use the jQuery selector for particular DropDownCheckBoxes and find the SPAN inside thatRefer below sampleHTMLlt Register TagPrefix34cc434 Namespace34SaplinControls34 Assembly34DropDownCheckBoxes34 gtltDOCTYPE html PUBLIC 34W3CDTD XHTML 10 TransitionalEN34 34httpwwww3orgTRxhtml1DTDxhtml1transitionaldtd34gtlthtml xmlns34httpwwww3org1999xhtml34gtlthead runat34server34gt lttitlegtlttitlegt ltstyle type34textcss34gt body fontfamily Arial fontsize 10pt ltstylegt ltscript type34textjavascript34 src34httpscdnjscloudflarecomajaxlibsjquery371jqueryminjs34gtltscriptgt ltscript type34textjavascript34gt function var select 34idDropDownCheckBoxes1 idcaption34 if select null

ASP.Net DropDownCheckBoxes: Change default select text using jQuery in multiple DropDownCheckBoxes

counterk...

SOLVED CLOSED ACTIVE ANSWERED
User: counterkin
Posted: on Jul 22, 2024 03:10 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 425
Sample Code: Download

Hi.. thanks for your help.

ASP.Net DropDownCheckBoxes: Change default select text in jQuery

But something went wrong when i have more than 1 dropdwoncheckboxes.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var select = $("[id*=DropDownCheckBoxes1] [id*=caption]");
            if (select != null) {
                select.html("Select Category");
            }
            var selectAll = $("[id*=checks] span").eq(0).find('label');
            if (selectAll != null) {
                selectAll.html("Select All Categories");
            }
            var select = $("[id*=DropDownCheckBoxes2] [id*=caption]");
            if (select != null) {
                select.html("Select Fruit");
            }
            var selectAll = $("[id*=checks] span").eq(0).find('label');
            if (selectAll != null) {
                selectAll.html("Select All Fruits");
            }
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <cc4:DropDownCheckBoxes ID="DropDownCheckBoxes1" runat="server" Width="180px" UseSelectAllNode="True">
        <Style SelectBoxWidth="195" DropDownBoxBoxWidth="160" DropDownBoxBoxHeight="90" />
        <Items>
           <asp:ListItem Text="Local"></asp:ListItem>
           <asp:ListItem Text="Oversea"></asp:ListItem>
        </Items>
    </cc4:DropDownCheckBoxes>  
    <cc4:DropDownCheckBoxes ID="DropDownCheckBoxes2" runat="server" Width="180px" UseSelectAllNode="True">
        <Style SelectBoxWidth="195" DropDownBoxBoxWidth="160" DropDownBoxBoxHeight="90" />
        <Items>
           <asp:ListItem Text="Mango"></asp:ListItem>
           <asp:ListItem Text="Apple"></asp:ListItem>
           <asp:ListItem Text="Banana"></asp:ListItem>
        </Items>
    </cc4:DropDownCheckBoxes>      
    </div>
    </form>
</body>
</html>

Download FREE API for Word, Excel and PDF in ASP.Net

dharmend...

0 1

Reply
ANSWER
User: dharmendr
Replied: on Jul 22, 2024 03:23 AM
Report

Hi counterkin,

For changing the SelectAll text you need to use the jQuery selector for particular DropDownCheckBoxes and find the SPAN inside that.

Refer below sample.

HTML

<%@ Register TagPrefix="cc4" Namespace="Saplin.Controls" Assembly="DropDownCheckBoxes" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        body { font-family: Arial; font-size: 10pt; }
    </style>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var select = $("[id*=DropDownCheckBoxes1] [id*=caption]");
            if (select != null) {
                select.html("Select Category");
            }
            var selectAll = $("[id*=DropDownCheckBoxes1] [id*=checks] span").eq(0).find('label');
            if (selectAll != null) {
                selectAll.html("Select All Categories");
            }
            select = $("[id*=DropDownCheckBoxes2] [id*=caption]");
            if (select != null) {
                select.html("Select Fruit");
            }
            selectAll = $("[id*=DropDownCheckBoxes2] [id*=checks] span").eq(0).find('label');
            if (selectAll != null) {
                selectAll.html("Select All Fruits");
            }
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <cc4:DropDownCheckBoxes ID="DropDownCheckBoxes1" runat="server" Width="180px" UseSelectAllNode="True">
                <Style SelectBoxWidth="195" DropDownBoxBoxWidth="160" DropDownBoxBoxHeight="90" />
                <Items>
                    <asp:ListItem Text="Local"></asp:ListItem>
                    <asp:ListItem Text="Oversea"></asp:ListItem>
                </Items>
            </cc4:DropDownCheckBoxes>
            <cc4:DropDownCheckBoxes ID="DropDownCheckBoxes2" runat="server" Width="180px" UseSelectAllNode="True">
                <Style SelectBoxWidth="195" DropDownBoxBoxWidth="160" DropDownBoxBoxHeight="90" />
                <Items>
                    <asp:ListItem Text="Mango"></asp:ListItem>
                    <asp:ListItem Text="Apple"></asp:ListItem>
                    <asp:ListItem Text="Banana"></asp:ListItem>
                </Items>
            </cc4:DropDownCheckBoxes>
        </div>
    </form>
</body>
</html>

Screenshot

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

ASP.Net DropDownCheckBoxes: Change default select text using jQuery in multiple DropDownCheckBoxes

Company

Explore

Follow us

Contact Us