Check/Uncheck All Checkboxes with JQuery

This particular article is about a pretty common functionality which I think most of the software engineers face in their projects. Even I came across the same situation many times. Previously I used to achieve the functionality via JavaScript, which really worked flawlessly. But as a software engineer, I think one should always adapt the new technology. So, this time I tried to achieve the same via JQuery as its booming now and one need to upgrade himself. So what functionality are we talking about? See below given image.

Okay. So you must have got the idea about the functionality. Yes, you guessed it right. It’s about selecting all the items of checkbox list, when select all is checked. You can find thousands of solution using Jquery when you google it. Then why you are here. Well, in fact I googled a lot but didn’t even come across to a single article which solves my purpose. Let me explain the requirement of the functionality here.

15 New Features of jQuery 1.4

jQuery 1.4 was recently released. There are many new features, enhancements and performance improvements included in 1.4!

You can download jQuery 1.4 right now, here:http://code.jquery.com/jquery-1.4.js

Check this article to know 15 New Features of JQuery 1.4

Enjoy..

Set Page Position after asyncPostback

I will start this article, with one of the problem which I faced recently.

BackGround

I was working with a page. The page is divided into two parts.

1. Add/Update/Delete (I call it Area 1)

2. Listing of records (I call it Area 2)

I have used Repeater control with no paging (Though the records are more but my client hates paging. :) ). Above the repeater control, there were some textbox, dropdowns, checkbox, listbox etc. were placed used for add/update operations. There is a link button in the repeater control for every row, which when clicked opens the records in update mode. It fills all the control with data placed on Area 1 . Everything is placed in an UpdatePanel.

Problem

There were more than 10000 records listed in the repeater. When I click the very last record for editing, asynchronous postback happens and data is loaded for editing in Area 1 . But the problem was with the page position. I was not able to see the control's of Part1, as page was maintaining it's scroll position after async postback. This is what I don't want. As it's not at all user friendly. End-User will never come to know that record has been opened in edit mode. I set the "MaintainScrollPositionOnPostback" property to false but it was not working because of AJAX. Somehow, I want page position to be set to (0,0) so that I can see Area 1 controls.

Solution

The solution was to set Page position back to 0,0, at the end of ajax request. Here is what I did. See below code.

  
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
    window.scroll(0,0);
}
</script>

Javascript provides a function scroll() which basically scrolls page position to the specified value. It takes two arguments Top and left. I passed it 0,0 and it worked for me.

Enjoy..