Skip to main content

select multiple rows with checkboxes like GMAIL Example 1

Are you looking for shift-select multiple checkboxes like GMail?


solution: This thing can be done by jquery. see the following example



<html>
<head>
</head>
<body>
<input type="checkbox" id="id_chk1" class="chkbox" value="1" />Check 1<br/>
<input type="checkbox" id="id_chk2" class="chkbox" value="2" />Check 2<br/>
<input type="checkbox" id="id_chk3" class="chkbox" value="3" />Check 3<br/>
<input type="checkbox" id="id_chk4" class="chkbox" value="4" />Check 4<br/>
<input type="checkbox" id="id_chk5" class="chkbox" value="5" />Check 5<br/>
<input type="checkbox" id="id_chk6" class="chkbox" value="6" />Check 6<br/>
<input type="checkbox" id="id_chk7" class="chkbox" value="7" />Check 7<br/>


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
var lastChecked = null;
$(document).ready(function() {
var $chkboxes = $('.chkbox');
$chkboxes.click(function(e) {
if(!lastChecked) {
lastChecked = this;
return;
}
if(e.shiftKey) {
var start = $chkboxes.index(this);
var end = $chkboxes.index(lastChecked);
$chkboxes.slice(Math.min(start,end), Math.max(start,end)+ 1).attr('checked', lastChecked.checked);}
lastChecked = this;
});
});
</script>
</body>
</html>

Comments

Post a Comment

Popular posts from this blog

Contact us Forms Links

Hi Friends This is my second post to blogger.com. and this time I am going to share my few useful resource links with you all. This post is regarding to “How to create contact us form to the html page” So please go to the following sites 1) http://wufoo.com/gallery/templates/forms/contact-form/ Thats it
Post a Comment
Read more
Hello Friends This is an important moment for me! This is the first blog I’ve ever written. It’s something I’ve wanted to do for a long time, but wasn’t sure how to do it, where, when, or even if. And finally, now here I am. People say that blogs are like a diary (do I hide it under my bed, lock it with a key? Tell it all my secrets? It seems like a wonderful place to share my thoughts with you, or what I do.) It’s going to be fun sharing my thoughts with you, outside the context of a book. Ok let me tell you about myself. I am a I.T Engineer and having 2 year experience about the I.T Sector. After Completion of my graduation i worked as a "Web Designer" for 1.3 years then i Switch my profile to software engineer and I am working as a Software engineer from 6 months. so basically my blogs are all bout to the new technologies, interesting and important codes and some useful resources. For more about myself please visit my website: http://www.lokeshchadha.co.cc/ . 1)..Downl...
Post a Comment
Read more

Three Tier Architecture in asp.net using c#

3-Tier Architecture in asp.net using c# In this asp.net tutorial you will learn how to implement 3-tier architecture in asp.net using c#. 3-Tier architecture is also called layered architecture. Some people called it n-tier architecture. Layer architectures are essentially objects and work in object oriented environment just like asp.net. 3-tier architecture is a very well known architecture in the world of software development, it doesn't matter whether you are developing web based application or desktop based, it is the best architecture to use. 3-Tier Architecture in asp.net using c# 3-Tier architecture consists of 1) UI or Presentation Layer 2) Business Access Layer or Business Logic Layer 3) Data Access Layer Presentation Layer Presentation layer consists of pages like .aspx or desktop based form where data is presented to users or getting input from users. Business Logic layer or Business Access Layer Business logic layer contains all of the business logic. Its r...
Post a Comment
Read more