|
JavaScript - How To Post Checkbox Group
Hi, I'm hoping someone can help. I have this code which allows a user to check multiple checkboxes by clicking just one check box. However, when I post the form, I only get the value of one check box. Suppose, I don't check the 'select all' check box and want to check only 1 and 3 checkbox, I still get the value for only one check box. Any help will be much appreciated! Cheers!
Code: <SCRIPT LANGUAGE="JavaScript">
<!--
<!-- Begin
function Check(chk)
{
if(document.myform.Check_ctr.checked==true){
for (i = 0; i < chk.length; i++)
chk[i].checked = true ;
}else{
for (i = 0; i < chk.length; i++)
chk[i].checked = false ;
}
}
// End -->
</script>
Here is the code for body part .
<form name="myform" action="checkboxes.asp" method="post">
<b>Scripts for Web design and programming</b><br>
<input type="checkbox" name="check_list" value="1">ASP<br>
<input type="checkbox" name="check_list" value="2">PHP<br>
<input type="checkbox" name="check_list" value="3">JavaScript<br>
<input type="checkbox" name="check_list" value="4">HTML<br>
<input type="checkbox" name="check_list" value="5">MySQL<br>
<input type="checkbox" name="Check_ctr" value="yes"
onClick="Check(document.myform.check_list)"><b>Check Control</b>
</form>
Similar TutorialsI have a code that checks individual checkboxes with a value in my group checkbox. Works great except When my group checkbox value ="955, 957,1956" it checks box 956 as well. How would I fix that? <!DOCTYPE html> <html> <head> </head> <body> ///----------GROUP CHECKBOXES---------------------/// 1,2,3<input type="checkbox" value="1,2,3" onclick="checkBox(this)"/> 4,5,6<input type="checkbox" value="4,5,6" onclick="checkBox(this)"/> 7,8,9<input type="checkbox" value="7,8,9" onclick="checkBox(this)"/> 955,957,1956<input type="checkbox" value="955,957,1956" onclick="checkBox(this)"/> ///----------Individual Checkboxes------------/// <div id="targets"> 1<input type="checkbox" value="1"/> 2<input type="checkbox" value="2"/> 3<input type="checkbox" value="3"/> 4<input type="checkbox" value="4"/> 5<input type="checkbox" value="5"/> 6<input type="checkbox" value="6"/> 7<input type="checkbox" value="7"/> 8<input type="checkbox" value="8"/> 9<input type="checkbox" value="9"/> 955<input type="checkbox" value="955"/> 956<input type="checkbox" value="956"/> 957<input type="checkbox" value="957"/> 1956<input type="checkbox" value="1956"/> </div> <script type="text/javascript"> function checkBox(box){ var cbs=document.getElementById("targets").getElementsByTagName("input") if (box.checked){ for (i=0;i<cbs.length;i++){ if(cbs[i].type=="checkbox"&&box.value.indexOf(cbs[i].value)!=-1){ cbs[i].checked=true; } } } else { for (a=0;a<cbs.length;a++){ if(cbs[a].type=="checkbox"&&box.value.indexOf(cbs[a].value)!=-1){ cbs[a].checked=false; } } } } </script> </body> </html> So here's what i want to do: i have 2 checkboxes, when Checkbox A is checked, i want to automatically check the checkbox B. When A is unchecked, then uncheck B how can i do that? thanks a lot ! Having problems with IE not displaying the page correctly with I hide <li> I have commented out the lines that are messing up the display, can anyone tell me how I correctly hide the <li> tags ? Code: <div class="innerformboxes">
<!-- misc start -->
<ul>
<li class="<? if ($empty_Field == "paymentMethod") {?>emptyfield<? } else { ?>field<? } ?>"> Payment Method * </li>
<li class="value">
<select name="paymentMethod" onChange="if(this.value == 'Other') { document.getElementById('altpaymentMethodDiv').style.display='block'; } else { document.getElementById('altpaymentMethodDiv').style.display='none'; document.getElementById('altpaymentMethod').value=''; };">
<option value="">Select Payment Method</option>
<option <? if($paymentMethod == 'Cash') { echo 'selected'; } ?> value="Cash">Cash</option>
<option <? if($paymentMethod == 'Credit Card') { echo 'selected'; } ?> value="Credit Card">Credit Card</option>
<option <? if($paymentMethod == 'Account') { echo 'selected'; } ?> value="Account">Account</option>
<option <? if($paymentMethod == 'Other') { echo 'selected'; } ?> value="Other">Other</option>
</select>
</li>
<!--
<div < ? if($paymentMethod == 'Other') { echo 'style="display: block;"'; } else { echo 'style="display: none;"'; } ?> id="altpaymentMethodDiv">
-->
<li class="<? if ($empty_Field == "altpaymentMethod") {?>emptyfield<? } else { ?>field<? } ?>"> Other <input type="text" autocomplete="off" name="altpaymentMethod" id="altpaymentMethod" value="<?=$altpaymentMethod;?>" style="width: 200px;"> </li>
<!--
</div>
-->
<? if(!isSet($_SESSION['FM_user'])) { ?>
<li class="<? if ($empty_Field == "previousClient") {?>emptyfield<? } else { ?>field<? } ?>"> Are you a Previous Client * </li>
<li class="value">
<input type="radio" name="previousClient" value="Yes" <? if($previousClient == 'Yes') { echo 'checked'; } ?>> Yes <br>
<input type="radio" name="previousClient" value="No" <? if($previousClient != 'Yes') { echo 'checked'; } ?>> No
</li>
<? } ?>
</ul>
<!-- misc end -->
</div>
Hi, If I have two check-boxes and one is already checked and then the is checked, how would I get it to uncheck the first one using JavaScript. Thanks, Cs1h If I have a radio button group called "RADIO1" how can I put focus on there? Is it like this? document.theForm.RADIO1[0].focus; So this is how I setup an item in the list and it works fine but I can't fine the syntax for setting an option group in javascript. Cheers Daniel. Code: Users[0] = new Option("Text to show in list", "Item Value");
Hi I want a javascript code that replicates the function of SQL group by clause. I tried in several ways but couldnt find the right approach. It would be of great help if someone could guide/do the code for this process. Thanks in advance. Calvin Hey folks, I have a question around Spry. There are two navigational elements to the website I'm building and I'm using Spry to do it. I have a horizontal header menu and vertical main menu. Both menus must load their content in the same content area. I've tried a ton of things and I can't get them to work without breaking anything. Here is the basic Spry code. Any help would be very much appreciated. Thanks!! Code: <div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">Content 1</div>
<div class="TabbedPanelsContent">Content 2</div>
</div>
</div>
<script type="text/javascript">
<!--
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
//-->
</script>
The CSS and Jscript files are attached. Hi i have 2 radios : what i need is once i choose the 1st radio i will get 1st DDL with folollwing element : Orange Apple Kiwi if i chose the 2nd radio i should have the 2nd DDL with : Potato Tomato legume ? thanks Hi, I have an array in JavaScript. How can I GROUPBY Branch, then by Client and then by Referral Type and COUNT DISTINCT LPS # in JavaScript. Please note I need to do this client side using JavaScript. Array Data: Branch Client Referral Type LPS # 402036 402430 Psychological File Review 30 402049 402805 In-Home Assessment 10.87927 402050 402993 Chiropractic Assessment 100 402049 402805 Chiropractic File Review 10.88054 402049 402806 Chiropractic File Review 10.88055 402049 402806 Defense Medical 20 402049 402807 Chiropractic Assessment 10 402049 402807 In-Home Assessment + Form 1 10.88054 402049 402807 Physiotherapy Assessment 10 402049 402808 Attendant Care Assessment 10 402049 402808 Chiropractic Assessment 10.88041 402049 402808 In-Home Assessment 10 402049 402816 Chiropractic Assessment 10.85316 402049 402827 Neurological File Review 10.88047 402049 402827 Social Work File Review 10.88044 402050 402605 Psychological File Review 880434 402050 402661 Physician Assessment 878203 402050 402993 Physician Assessment 1000 402036 402575 Psychological File Review 50 Thanks I was trying to get total amount from these all checkbox, when I submit, but I don't know somewhere wrong. Please help me out. Here is my code: <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> Form </title> <script language = "JavaScript"> // The event handler functions for the check boxes function appleHandler() { var number = document.orderForm.apples.value; total = total + number * 0.59; } function orangeHandler() { var number = document.orderForm.oranges.value; total = total + number * 0.49; } function bananaHandler() { var number = document.orderForm.bananas.value; total = total + number * 0.39; } // The event handler function to produce the total cost message // when "submit" is clicked function finish() { total = total * 1.05; alert("Thank you for your order \n" + "Your total cost is: $" + total + "\n"); } </script> </head> <body> <h3> Order Form </h3> <form name = "orderForm" onSubmit = "finish()"> <p> <input type = "checkbox" name = "apples" size = "3" onClick = "appleHandler()" /> Apples </p><p> <input type = "checkbox" name = "oranges" size = "3" onClick = "orangeHandler()" /> Oranges </p><p> <input type = "checkbox" name = "bananas" size = "3" onClick = "bananaHandler()" /> Bananas </p><p> <input type = "reset" name = "reset" /> <input type = "submit" name = "submit" /> </p> </form> </body> </html> Looking for a simple method to Toggle textbox yes/no using CheckBox This example does not work! But I hope this will help explain what I am trying to do Code: <SCRIPT LANGUAGE="JavaScript">
function YesOrNo() {
if(document.formname.checkboxname.checked)
{
document.formname.textname.disabled='Yes';
}
else
{
document.formname.textname.disabled='No';
}}
</SCRIPT>
<form name="formname">
<input type="text" size="10" name="textname">
<input type="checkbox" onclick="YesOrNo()" name="checkboxname" value="Yes">
</form>
Hi, I have a checkbox and when I "check" I want to add a <p> inside of an <div> and when I "uncheck" I want to remove the <p> from <div>. I've tried this but it's not working Code: $('#checkbox').change(function(){
$('div').html('<p>Some Text</p>');
}, function() {
$('div').remove('<p>Some Text</p>');
});
I hope you can help.. Regards I am making a google CSE for a client site and I need to concatenate checkbox values together on the end of another form value. So I have a text box and the checkboxes: Code: <input name="q" cid="q" size="25" maxlength="50" value"off road tires"> <input type="checkbox" name="q" id="q" value="cooper|hankook" /> <input type="checkbox" name="q" id="q" value="Mickey Thompson|Bfgoodrich|GBC" /> <input type="checkbox" name="q" id="q" value="Hoosier|Nitto" /> For Google the URL string needs to be like this: Code: results.html?q=off road tires AND inurl:cooper|hankook|Mickey Thompson|Bfgoodrich|GBC this string says the person did not check the last box. I am having a hard time trying to do this. If you guys know a better way to accomplish the same thing I am all ears but I thought I would bring it to the experts and see what they had to say. Thanks for the help! Sorted. Close thread please. New problem in post below VVV All, I have the following checkbox code: PHP Code: echo "<input name=\"picbigid[]\" type=\"checkbox\" value=\"$pic[src_big]\">"; I then want to select all the checkboxes so I have this code: [PHP] echo "<input type=\"button\" name=\"CheckAll\" value=\"Check All\" onClick=\"checkAll(document.photos.picbigid)\"> <input type=\"button\" name=\"UnCheckAll\" value=\"Uncheck All\" onClick=\"uncheckAll(document.photos.picbigid)\">"; [PHP] My JS function is: Code: function checkAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = true ;
}
function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = false ;
}
If I do it like this: PHP Code: echo "<input name=\"picbigid\" type=\"checkbox\" value=\"$pic[src_big]\">"; It works but I can't have it like that because the form posts to another PHP page that needs the input name as an array. Any ideas? Thanks! Firebug returns an error saying msg.elements is undefined. I'm trying to make a function that will enabled a delete button if any of the check boxes in a list are checked. Code: function selectone () {
var msg = document.getElementsByName('pm');
var i = 0;
for(i; i < msg.elements.length; i++)
{
if(msg.elements[i].checked == true)
{
document.getElementById('multiple_action').disabled = false;
document.getElementById('drop_button').setAttribute("class", "drop_button");
}
else
{
document.getElementById('multiple_action').disabled = true;
document.getElementById('drop_button').setAttribute("class", "drop_button disabled");
}
}
}
Hi, I have the following codes but my checkbox is not appearing. The values of the checkbox do print out in the alert. Can anyone tell me what is wrong with it? Thank you! Code: var table = document.getElementById('maintable');
var i; // iterator
var item; // pointer to item in received list
for(i = 0;
(item = contacts.ReturnValue.getNext()) != undefined;
++i) {
table.insertRow(i + 1);
var result = "<td>";
if(item.FirstName != undefined) {
result += item.FirstName.Value;
}
result += "</td><td>";
if(item.LastName != undefined) {
result += item.LastName.Value;
}
result += "</td><td>";
if(item.MobilePhoneGen != undefined) {
result += item.MobilePhoneGen.Value;
}
result += "</td><td>";
if(item.EmailGen != undefined) {
result += item.EmailGen.Value;
}
var td1 = document.createElement("td");
var chkbox = document.createElement('input');
chkbox.type='Checkbox';
table.rows[i + 1].innerHTML = result;
chkbox.value=item.MobilePhoneGen.Value;
td1.appendChild(chkbox);
alert(chkbox.value);
}
hi all , I'm new to js , here is my problem : i want to make a button to toggle a checkbox , here is my code ,when i replace box.checked with boxVal it doesn't work! Code: <!DOCTYPE html>
<html>
<head>
</head>
<body>
<p><button>Toggle checkbox</button></p>
<input type="checkbox" id="box"/>
<script>
var button = document.getElementsByTagName("button")[0];
var box = document.getElementById("box");
var boxVal = document.getElementById("box").checked;
button.onclick = function(){
if (box.checked==false){ //when i replace box.checked with boxVal it doesn't work!
box.checked=true;
}
else if(box.checked==true){
box.checked=false;
}
}
</script>
</body>
</html>
|
|||||||