JQuery | Internet solutions team

Check uncheck all checkbox in asp.net web form st using jquery

Check uncheck all check boxes on an asp.net web form using jquery.

On click of the link it behaves like a toggle button and changes its text also it check and un check all check boxes on the asp.net page

Asp.net Code

<a href=”#” id=”lnkAll”>Check all</a>

JQuery Code

$(“#lnkAll”).click(function(e) {

var currentVal = $(“#lnkAll”).text();

if (currentVal == “Check all”) {
$(‘input[type=checkbox]‘).attr(‘checked’, true);
$(“#lnkAll”).text(“Uncheck all”);

}
else if (currentVal == “Uncheck all”) {
$(‘input[type=checkbox]‘).attr(‘checked’, false);
$(“#lnkAll”).text(“Check all”);

}
});

I Wan to share this post:

Dual asp.net list boxes and jquery

Move selected item to the left hand side list box, move all items to the left hand side list box, move selected item to the right hand side list box, and move all items to the right hand list box. Let’s implement above features using JQuery.

ASP.NET Code

<asp:ListBox ID=”ListBox1″ runat=”server”

Height=”550px” SelectionMode=”Multiple”>

<asp:ListItem>One</asp:ListItem>

<asp:ListItem>Two</asp:ListItem>

<asp:ListItem>Three</asp:ListItem>

<asp:ListItem>Four</asp:ListItem>

<asp:ListItem>Five</asp:ListItem>

<asp:ListItem>Six</asp:ListItem>

<asp:ListItem>Seven</asp:ListItem>

<asp:ListItem>Eight</asp:ListItem>

<asp:ListItem>Nine</asp:ListItem>

<asp:ListItem>Ten</asp:ListItem>

</asp:ListBox>

</div>

<!– buttons –>

<br />

<br />

<a id=”btnRight”>Right >></a>

<br />

<br />

<br />

<asp:Button ID=”btnDone” runat=”server” Text=”Done” />

</div>

<asp:ListBox ID=”ListBox2″ runat=”server”

Height=”550px” SelectionMode=”Multiple”></asp:ListBox>

</div>

JQUERY Code

$(document).ready(function() {
//move selected item to the right
$(“#btnRight”).click(function() {
$(“#<%=ListBox1.ClientID%> > :0ption[selected]“).appendTo($(“#<%=ListBox2.ClientID%>”));
});

//move all items to the right
$(“#btnRightAll”).click(function() {
$(“#<%=ListBox1.ClientID%> > :0ption”).appendTo($(“#<%=ListBox2.ClientID%>”));
});

// move selected item to the left
$(“#btnLeft”).click(function() {
$(“#<%=ListBox2.ClientID%> > :0ption[selected]“).appendTo($(“#<%=ListBox1.ClientID%>”));
});

// move all items to left list
$(“#btnLeftAll”).click(function() {
$(“#<%=ListBox2.ClientID%> > :0ption”).appendTo($(“#<%=ListBox1.ClientID%>”));
});
});

</script>

Note:

In javascript replace first letter of “:0ption”
with English letter “o” I am using 0 (zero) as it was putting smiley while i was using English letter o.

I Wan to share this post: