...

View Full Version : Concatenating checkbox choices into text



erypmav
05-24-2006, 06:58 PM
Hello!
I have a very simple thing I want to do but am not a very experienced coder. I have a set of 5 checkboxes that I would like to concatenate the values of with text.
Example:
<tr>
<td><input type="checkbox" name="IND" value="1" checked>One</td>
<td><input type="checkbox" name="IND" value="2">Two</td>
<td><input type="checkbox" name="IND" value="3">Three</td>
<td><input type="checkbox" name="IND" value="4">Four</td>
<td><input type="checkbox" name="IND" value="5">Five</td>
</tr>

I'm looking for a funtion that will dump text into a variable. The text should read:
"WHERE TYPE EQ <value of checkbox> OR <value of checkbox>"...etc... depending upon how many have been selected.
So, if the user checks 'two', 'four' and 'five' then the text should read "WHERE TYPE EQ 2 OR 4 OR 5"
If they only pick 'one', then the text should read "WHERE TYPE EQ 1"

I'm guessing it should be a loop where the value of IND eq 'checked' but I've never dealt with these before and I'm lost.

Thanks in advance for your help!

digital-ether
05-25-2006, 09:46 AM
<table>
<tr>
<td><input type="checkbox" name="IND" value="1" checked>One</td>
<td><input type="checkbox" name="IND" value="2">Two</td>
<td><input type="checkbox" name="IND" value="3">Three</td>
<td><input type="checkbox" name="IND" value="4">Four</td>
<td><input type="checkbox" name="IND" value="5">Five</td>
</tr>
<tr>
<td colspan="5">
<input type="button" name="qbutton" value="Create Query" onclick="alert(checkboxQueryString('IND'));">
</td>
</tr>
</table>

<script type="text/javascript">
<!--

function checkboxQueryString(name) {
var elements = document.getElementsByName(name);
//alertObj(ind);
var n = elements.length;
var checked = new Array();
for (var i = 0, j = 0; i < n; i++) {
var el = elements[i];
if (el.type == 'checkbox' && el.checked) {
checked[j] = el.value;
j++;
}
}
return 'WHERE TYPE EQ ' + checked.join(' OR ');
}

// alerts the object's immediate properties
// just here to test stuff
function alertObj(o) {
s = '';
for(e in o) {s += e+'='+o[e]+'\n';}
alert( s );
}

//-->
</script>



That should do the trick.
The "checkboxQueryString" function takes the name of the check boxes as a parameter, and returns a string formatted the way you wanted.

I'm assuming the string is a query, hence the name of the function. I don't recognize the syntax. What't it for?

If you're using the returned in a server side app, I'd recommend you format the query string server side for security purposes.

To get the Checkboxes with the same name I used:


var elements = document.getElementsByName(name);

Then looped through each object in the returned object collection to test if the object is a checkbox and is checked:


if (el.type == 'checkbox' && el.checked) {

the values of the checked checkboxes are saved in teh Array, checked.


checked[j] = el.value;

After we have a collection of all the checkbox values for those that are checked, we return it with:


return 'WHERE TYPE EQ ' + checked.join(' OR ');

joining each "checked" Array value together with the string " OR ".:thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum