Jump to content

check all box via ajax


Shadowing
 Share

Recommended Posts

I'm so stuck atm :(I know how to do a check all check box but doing it using ajax is a differant story.

$return = "<form name='frm1' id='frm1' action='' method='post'15.onsubmit='javascript:return submitIt('frm1')'> <input type='checkbox' name='checkAll' value='x' id='checkall' onclick='checkUncheckAll('association[]', this.checked)' />

I have check boxes being echoed in with a id assigned to them

<td><input type='checkbox' name='association[]' value= '$sent_id'  /></td>"

I"m converting the whole page to a string and returning it via ajax

echo json_encode(array("display" => $return));

I was trying to advoid the onclick and try something like

$("input#checkAll").live('click' ,function(event) { 	var test = $("association[]").attr("name"); 	 checkUncheckAll(test, this.checked);  });

check all function

function checkUncheckAll(groupName, checkState){    var groupObj = document.forms[0].elements[groupName];    var groupLen = groupObj.length;	   for(var groupIdx=0; groupIdx<groupLen; groupIdx++)     {	      groupObj[groupIdx].checked = checkState;      }      return;   } 

Link to comment
Share on other sites

nice thanks dsonesuk how do I grab the ids of each one and put it into array so i can send it back to my php script as an array of the ones that was checked. I need to look up this attr thing for jquery lol. didnt realize there was two parameters for it

Link to comment
Share on other sites

I think im close but idk lolwhen i look at jquery i think php and the syntax is just a mess for melooked up the the each loop on jquery's website but having troubles. If this was php id have it no problem :)

$('input[name="association[]"]').each(function(index) {  	var array[] = index.attr("id");	  });  alert(array[]);

Link to comment
Share on other sites

$("#checkAll").live('click' ,function(event) {event.preventDefault();				$('input[name="association[]"]').attr('checked', 'checked');		var array = new Array();		$('input[name="association[]"]').each(function() {		  var index_ref=$(this).index()	   array[index_ref] = $(this).attr("id");	  alert(array[($(this).index())] )  });  });

Edited by dsonesuk
Link to comment
Share on other sites

lol dsonesuk i was like way off, so when I do index after function. its pretty much making a function called index? i can never understand that.any chance you could add some comments for each line. When i see index there i think its like a callback? run everything index is attached to after function lol? Every time i see a word with () next to it I think function but apparently this is differant in java script?

each(function(index) {

anyways so seperated the code and have this below

	  var array = new Array();	  $('input[name="association[]"]').each(function(index) {		var index_ref=$(this).index()		array[index_ref] = $(this).attr("id");		alert(array[($(this).index())] )	  });	});

This gives me all the id's of every box rather its checked or unchecked.so now i need to figure out how to tell or just only grab the ones that are checked. Cause im assigning it to a seperate button. this is for a mail system so sending all checked to trash etc...

Link to comment
Share on other sites

$("#checkAll2").live('click' ,function(event) {event.preventDefault(); 		var array = new Array();		$('input[name="association[]"]:checked').each(function() { //loops through all inputs with same name that are checked ':checked'		//$('input[name="association[]"]').not($('input[name="association[]"]:checked')).each(function() { //loops through all inputs with same name that are NOT checked		  var index_ref=$(this).index() // .index() is jquery function that will return index ref of group of elements as defined by the selector used for the each function	   array[index_ref] = $(this).attr("id"); //array will use index ref to store id ref using variable that retrieves element index ref using function index()	  alert(array[($(this).index())] )  }); 	});

Edit: index argument in functioin is not required

$('input[name="association[]"]').each(function(index) { 

should be

$('input[name="association[]"]').each(function() {

Edited by dsonesuk
Link to comment
Share on other sites

Nice that works. geez jquery is so amazing lol. i really need to get more in tuned with it.As always thanks alot dsonesuk! oh and thanks again for taking time out to place comments on that Edit: nice you did a line of them not being checked also :)

Edited by Shadowing
Link to comment
Share on other sites

sigh cant believe im still having problems lol for starters how do i alert the array in a way so i can at least see the array like i would use print_r in phpso i can at least see what the array looks like.

var array = new Array();$('input[name="association[]"]:checked').each(function() {var index_ref=$(this).index()array[index_ref] = $(this).attr("id"); }); // does these brackets control the loop?

The problem im having now is I need to beable to read the array outside the last brackets assigned to a variable. assuming the brackets is part of the loop? I guess i could just build a string instead then explode it with php but id like to learn this. Really important stuff :) Im thinking i can use valueof to see my array but i cant figure out how to read it out side the brackets

Edited by Shadowing
Link to comment
Share on other sites

I tried doing this :) by wrapping a function around it then returning itbut it returns undefine

function checked_boxes() { var array = new Array(); $('input[name="association[]"]:checked').each(function() {    var index_ref=$(this).index()  array[index_ref] = $(this).attr("id");   }); return array;}var array = checked_boxes(); var value = valueOf(array); alert(value); 

Link to comment
Share on other sites

make the array global then you can access it outside document.ready

<script type="text/javascript">/*<![CDATA[*//*---->*/var array = new Array();$(document).ready(function(){$("#checkAll2").live('click' ,function(event) { event.preventDefault();                $('input[name="association[]"]:checked').each(function() {        //$('input[name="association[]"]').not($('input[name="association[]"]:checked')).each(function(index) {          var index_ref=$(this).index()	   array[index_ref] = $(this).attr("id");  }); // end of each()  runthis();    }); // end of click});function runthis(){for(i=0;i<array.length;i++){if(array[i] != undefined){ alert(array[i]); }}}/*--*//*]]>*/</script>

Link to comment
Share on other sites

Alright did all that, turns out that the variable array is only one number wierdwhen i do this code below with more then one box checked, it alerts all numbers as its looping through them so the loop is working. but i guess its not adding it to the array

	    $('input[name="association[]"]:checked').each(function() { 				  var index_ref=$(this).index()		   array[index_ref] = $(this).attr("id"); alert(array[($(this).index())] )  }); // end of each()

do we need to assign the index_ref as key? im fine with key starting out at 0 and incrementing so in that case cant we just get rid of the line

var index_ref=$(this).index()

and change bottom line to

array[] = $(this).attr("id"); 

Link to comment
Share on other sites

That not going to work, just realised you have to clear the array, or you end up with all checked being listed all the time as each is checked. try this

<script type="text/javascript">/*<![CDATA[*//*---->*/var array = new Array();$(document).ready(function(){$("#checkAll2").live('click' ,function(event) { event.preventDefault();var count=0;array.length=0;        $('input[name="association[]"]:checked').each(function() {        array[count] = $(this).attr("id");        count++;  }); // end of each()  runthis();    }); // end of click});function runthis(){for(i=0;i<array.length;i++){ alert(array[i]);}}/*--*//*]]>*/</script>

Link to comment
Share on other sites

nice all working now :) I was able to put the array variable back inside the button click also by passing the variable through the function agrumentsI just want to point out ever since you showed me that alert for error on data return has proved quite useful lol thanks a ton. at least have a working example to fall back on to look at in the future too.

$(function(){ $("input.bulk_trash").live('click' ,function(event) {event.preventDefault(); var array = new Array();var count=0;array.length=0;		$('input[name="association[]"]:checked').each(function() { 		array[count] = $(this).attr("id");		count++;  });   bulk_trash(array);	}); function bulk_trash(array) { $.ajax({		     url: "messages/inbox.php?functions=bulk_trash",		     type: 'POST',		     dataType: 'json',		     data: {		array: array   },     error: function(){	alert("Oops... seems to be problem retrieving data. function bulk_trash") 	},	success: function(response) {	$('div.message_action').html(response.display);	}}); });}});

Edited by Shadowing
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...