I'm trying to store the values
from a set of unchecked html
checkboxes. I understand that JQuery
does not have an :unchecked selector so I must invert the :checked selector. I've done this and I am getting the values of the unchecked boxes as well as a number of other values such as null
and 0
. I don't know where these are coming from.
Here is my HTML
:
<div id="tag_results">
<ul>
<li>
<input type="checkbox" value="29" name="tag" checked=""></input>
Agriculture
</li>
<li>
<input type="checkbox" value="30" name="tag" checked=""></input>
Angling
</li>
<li>
<input type="checkbox" value="37" name="tag"></input>
Animals
</li>
<li>
<input type="checkbox" value="54" name="tag" checked=""></input>
Arts
</li>
</ul>
</div>
Here is my JQuery
:
$('#saveBtn').click(function(e){
e.preventDefault();
//Get hidden field values and store in an Array
$tagArray = [];
$removeTags = [];
//Get the Checked Tags and store in an Array(will be added)
$('#tag_results :checked').each(function(){
$tagArray.push(this.value);
});
//Get the Unchecked Tags and Store in an Array(will be removed)
$('#tag_results :not(:checked)').each(function(){
$removeTags.push(this.value);
});
console.log($removeTags);
//Make Ajax request to the add_tags script and pass Array as parameter. When response recieved show dialog.
//Pass the name, id and type of company with the array of tags to the save_tags.php script.
$('#active_tags').load('pages/ajax/save_tags.php', {'removeTags': JSON.stringify($removeTags),'tags': JSON.stringify($tagArray) ,'name': $('#comp_name').val(), 'id': $('#comp_id').val(), 'type': $('#type').val() }, function(response, status, xhr){
});
});
this is the result of console.log
:
Array [ undefined, 0, 0, 0, "37", 0, "54" ]
This is the code I use to generate the html
for the checkboxes:
$output = "<ul>";
if(mysql_num_rows($result) > 0){//If results returned (tags found matching letter) so construct list
while($row = mysql_fetch_array($result)){//while there are rows in the results array add a list item
if(in_array($row['name'], $applied_tags)){
$output .= "<li>" .'<input checked type="checkbox" name="tag" value="'.$row['id'].'">' .$row['name'] .'</li>'.PHP_EOL;
}else{
$output .= "<li>" .'<input type="checkbox" name="tag" value="'.$row['id'].'">' .$row['name'] .'</li>'.PHP_EOL;
}
}
}else{//Else there was no matching tags so display an error message to the user.
$output .= "<li>No Tags found beginning with the letter " . $letter . "</li>";
}
$output .= "</ul>";
Does anyone have any clue what could be causing this? Surely based on the above code the array should contain the values 37 and 54...