JavaScript - For Statement To Update Variable If More Than 3 Checkboxes Selected
I am trying to get the variable extraCharge to increment by $1 for every topping over the 3 included toppings. How can this be done? For statements confuse me
Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Checkbox Toppings</title> <script type="text/javascript"> function validate(form) { var toppingsArray = document.form1.scripts.length; var extraCharge = 0; // Checking if at least one period button is selected. Or not. if (!document.form1.orderType[0].checked && !document.form1.orderType[1].checked) { alert("Please Select orderType"); return false; } var total="" for(var i=0; i < document.form1.scripts.length; i++) { if(extraCharge >= 3) alert("You can only select 2"); else if(document.form1.scripts[i].checked) total +=document.form1.scripts[i].value + "\n" } for(var i=3; i >= document.form1.scripts.length; i++) { var extraCharge = extraCharge + 1; } if(total=="") alert("select Toppings") else document.form2.checklist.value=(total); document.form2.toppingCharge.value=(extraCharge); return false; } </script> </head> <body> <h2>3 Toppings included, $1 for each additional topping</h2> <table width="333" border="0"> <tr> <td width="179"><form name="form1" method="post" action="" onchange="return validate(this)"> Select Order Type First:<br /> <input name="orderType" value="delivery" type="radio">delivery </font> <br /> <input name="orderType" value="takeOut" type="radio"><font face="verdana" size="2">takeOut</order></b> <br /> <br /> <br /> <input name="scripts" value="extracheese" type="checkbox">Extra Cheese <br /> <input name="scripts" value="sausage" type="checkbox">Sausage <br /> <input name="scripts" value="peperoni" type="checkbox">Peperoni </font> <br /> <input name="scripts" value="bacon" type="checkbox">Bacon <br /> <input name="scripts" value="canadianBacon" type="checkbox">Canadian Bacon <br /> <input name="scripts" value="mushroom" type="checkbox">Mushroom </font> <br /> <input name="scripts" value="pineapple" type="checkbox">Pineapple </font> <br /> <input name="scripts" value="onion" type="checkbox">Onion <br /> <input name="scripts" value="olive" type="checkbox">Olive <br /> <input name="scripts" value="greenPepper" type="checkbox">Green Pepper </font> </form> </td> <td width="144">Selected Toppings: <br /> <form name="form2"><textarea name="checklist" cols="20" rows="15" value="total"></textarea> Extra Topping Charge: <input name="toppingCharge" type="text" /> </form></td> </tr> </table> </body> </html> Similar TutorialsI'm struggling to make a js alert when none of the 3 checkboxes on my form are selected. Can anyone help me out? Code: function checkform ( form ) { if (form.contact_name.value == "contact name") { alert( "Please enter a contact name" ); form.contact_name.focus(); return false ; } if (form.last_name.value == "agency/company name") { alert( "Please enter agency/company name" ); form.last_name.focus(); return false ; } if (form.email.value == "email address") { alert( "Please enter contact email address" ); form.email.focus(); return false ; } if (form.telephone.value == "dates required") { alert( "Please enter dates required" ); form.telephone.focus(); return false ; } if (form.comments.value == "any other info") { alert( "Please enter more information" ); form.comments.focus(); return false ; } if (form.contact_name.value == "") { alert( "Please enter a contact name" ); form.contact_name.focus(); return false ; } if (form.last_name.value == "") { alert( "Please enter agency/company name" ); form.last_name.focus(); return false ; } if (form.email.value == "") { alert( "Please enter contact email address" ); form.email.focus(); return false ; } if (form.telephone.value == "") { alert( "Please enter dates required" ); form.telephone.focus(); return false ; } if (form.comments.value == "") { alert( "Please enter more information" ); form.comments.focus(); return false ; } return true ; } //--> </script> Code: <form name="contactform" method="post" action="send_form_email.php" onsubmit="return checkform(this);"> <table width="450px"> </tr> <tr> <td valign="top"> <input class="formbox" type="text" STYLE="text-align:right" value="contact name" name="contact_name" maxlength="50" size="30" onblur="if (this.value == '') {this.value = 'contact name';}" onfocus="if (this.value == 'contact name') {this.value = '';}"> </td> </tr> <tr> <td valign="top"> <input class="formbox" type="text" STYLE="text-align:right" value="agency/company name" name="last_name" maxlength="50" size="30" onblur="if (this.value == '') {this.value = 'agency/company name';}" onfocus="if (this.value == 'agency/company name') {this.value = '';}"> </td> </tr> <tr> <td valign="top"> <input class="formbox" type="text" STYLE="text-align:right" value="email address" name="email" maxlength="80" size="30" onblur="if (this.value == '') {this.value = 'email address';}" onfocus="if (this.value == 'email address') {this.value = '';}"> </td> </tr> <tr> <td valign="top"> <input class="formbox" type="text" STYLE="text-align:right" value="dates required" name="telephone" maxlength="30" size="30" onblur="if (this.value == '') {this.value = 'dates required';}" onfocus="if (this.value == 'dates required') {this.value = '';}"> </td> </tr> <tr> <td> <div id="checksdiv"> Full Day<input class="formcheck" type="checkbox" name="check[]" value="Full_Day"> Half Day<input class="formcheck" type="checkbox" name="check[]" value="Half Day"> Hourly <input class="formcheck" type="checkbox" name="check[]" value="Hourly"> </div> </td> </tr> <tr> <td valign="top"> <textarea class="formbox" name="comments" value="any other info" STYLE="text-align:right" maxlength="1000" cols="25" rows="6" onblur="if (this.value == '') {this.value = 'any other info';}" onfocus="if (this.value == 'any other info') {this.value = '';}"></textarea> </td> </tr> <tr> <td colspan="2" style="text-align:right"> <input type="image" value="Submit" src="images/submit.png" /> </td> </tr> </table> </form> I have an options list that is generated from a database. It currently has ~125 options in it. I've received the request that the user be able to either enter the corresponding number or select the option from the list. How can I update the "selected" attribute in the options list based on a number that may be entered in another text entry box? I have a form with several types of checkboxes, and I'm trying to check all but one of them to determine if any of those have been checked. I do not want to check 'all', but I want to see if any of the 'check_' or 'check2_' checkboxes have been checked. There are a variable number of checkboxes, so this is just an example with two of each. Set 1 and Set 2 will always have the same number of checkboxes as each other, though. I'm having trouble getting the function to do this - so any guidance would be appreciated. Code: <script language="JavaScript"> function checkForNone() { checked=false; for (i=0,n=selectForm2.elements.length;i<n;i++) { if (document.selectForm2.getElementById("check_"+String(i)).checked || document.selectForm2.getElementById("check2_"+String(i)).checked ) { checked=true; } } if (checked==true) { alert("OK!"); return true; } else { alert("Please select at least one checkbox."); return false; } } </script> PHP Code: echo " <form name='selectForm2' id='selectForm2'> Overall: <br> <input type='checkbox' name='all' value='' class='resultsAll' id='all'> Set 1: <br> <input type='checkbox' name='check_1' value='01' class='results1' id='check_1'><br> <input type='checkbox' name='check_2' value='02' class='results1' id='check_2'><br> <br> Set 2: <br> <input type='checkbox' name='check2_1' value='01' class='results2' id='check2_1' disabled='true'><br> <input type='checkbox' name='check2_2' value='02' class='results2' id='check2_2'> <br><br> Check for none selected <input type='button' onclick=\"checkForNone();\" /> </form> "; Hi, I have a BMI calculator that records my height / weight and BMI and I can change it then it updates, I'd like to be able to add one for each day and show all in a loop here is my current JavaScript: Code: /*** **** INSERT INTO TABLE ** ***/ function prePopulate(){ BMIDB.transaction( function (transaction) { //Starter data when page is initialized var data = ['1','','14','0','0','']; transaction.executeSql("INSERT INTO page_settings(id, fname, age, height, weight, gender, date) VALUES (?, ?, ?, ?, ?, ?, ?)", [data[0], data[1], data[2], data[3], data[4], data[5], data[6]]); } ); } /*** **** UPDATE TABLE ** ***/ function updateSetting(){ BMIDB.transaction( function (transaction) { if($('#fname').val() != '') { var fname = $('#fname').val(); } else { var fname = ''; } var age = $('#age').val(); var height = $('#height').val(); var weight = $('#weight').val(); var gender = $('#gender').val(); var date = $('#date').val(); transaction.executeSql("UPDATE page_settings SET fname=?, age=?, height=?, weight=?, gender=?, date=? WHERE id = 1", [fname, age, height, weight, gender, date]); } ); selectAll(); } function selectAll(){ BMIDB.transaction( function (transaction) { transaction.executeSql("SELECT * FROM page_settings;", [], dataSelectHandler, errorHandler); } ); } function dataSelectHandler(transaction, results){ // Handle the results for (var i=0; i<results.rows.length; i++) { var row = results.rows.item(i); var newFeature = new Object(); newFeature.fname = row['fname']; newFeature.age = row['age']; newFeature.height = row['height']; newFeature.weight = row['weight']; newFeature.gender = row['gender']; newFeature.date = row['date']; newFeature.height2 = newFeature.height / 100 newFeature.BMI = newFeature.weight / (newFeature.height2 * newFeature.height2) BMI = newFeature.BMI; bmiresult = BMI.toFixed(3); $('body').css('font-family',newFeature.height); $('#content').html('<h4 id="your_weight">'+ newFeature.fname +' your BMI is: </h4><span>'+ bmiresult +'</span>'); if(newFeature.fname != '') { $('#greeting').html('Hi '+newFeature.fname+'!'); $('#fname').val(newFeature.fname); } $('#height').val(newFeature.height); $('select#age').find('option[value='+newFeature.age+']').attr('selected','selected'); $('#weight').val(newFeature.weight); $('select#gender').find('option[value='+newFeature.gender+']').attr('selected','selected'); } } /*** **** Save 'default' data into DB table ** ***/ function saveAll(){ prePopulate(1); } function errorHandler(transaction, error){ if (error.code==1){ // DB Table already exists } else { // Error is a human-readable string. console.log('Oops. Error was '+error.message+' (Code '+error.code+')'); } return false; } function nullDataHandler(){ console.log("SQL Query Succeeded"); } /*** **** SELECT DATA ** ***/ function selectAll(){ BMIDB.transaction( function (transaction) { transaction.executeSql("SELECT * FROM page_settings;", [], dataSelectHandler, errorHandler); } ); } Hi everyone! I am building a simple web application in which the user inputs some html code in a <textarea> and the corresponding result (output of the code) is shown! The problem I am facing is that suppose the user enters some code and wishes to wrap it inside specific tags (e.g. <script></script>) then she just selects the corresponding code and clicks a predefined button and the selected code gets wrapped inside those tags! Now, what I am thinking right now is that when the user selects some code and clicks the button the selected text goes inside a variable (e.g. old_variable) and a new variable (new_variable = "<script>" + old_variable + "</script>") is returned! But I was just wondering how to send the selected code in the variable i.e. old_variable using JavaScript? Any help/hint/suggestion/advice would be highly valuable for me! Thanks! function amort(balance, interestRate, terms) { var monthlyRate = interestRate/12; var payment = balance * (monthlyRate/(1-Math.pow( 1+monthlyRate, -terms))); var result = "Loan amount: $" + balance.toFixed(2) + "<br />" + "Interest rate: " + (interestRate*100).toFixed(2) + "%<br />" + "Number of months: " + terms + "<br />" + "Monthly payment: $" + payment.toFixed(2) + "<br />" + "Total paid: $" + (payment * terms).toFixed(2) + "<br /><br />"; result += "<table border='1'><tr><th>Month</th><th>Balance</th>" + "<th>Interest</th><th>Principal</th>"; for (var a = 1; a <= terms; ++a){ result += "<tr><td>"+a +"</td>"; //for (var b = balance; b > 0; (balance-payment)){ var updatedBalance = balance;//updated monthly payment var monthRate = monthlyRate*balance;//amount of int per month var monthlyPrincipal = payment-monthRate;//updated monthly principal result += "<td>" + (updatedBalance.toFixed(2))+ "</td>"+ "<td>" + monthRate.toFixed(2) + "</td>" + "<td>" + (monthlyPrincipal.toFixed(2)) + "</td>"; if (balance > 0) { var updateBalance = balance-monthlyPayment; } //} result += "</tr>"; } result += "</table>"; return result; } This is my JS file and I am trying to create a loan table. The table is working and it puts the data in, but the updatedBalance is not decreasing when it goes thru the loop. I thought that if I put an IF statement in to update the amount after each time thru that would fix it. But instead it broke it. Any thoughts. Hello All, I am a beginner javascript student and am hoping to ask for some help with a problem i am having on an assignment. I have been assigned the old Pizza Form tutorial. My form asks for customer info, select size with radio button, and select toppings with checkboxes. I created a ValidateForm() function to check if these are filled in and output a message for each field saying "please fill in field." My problem now is that on Submit I need to print out a message with customer info, selected size, and selected toppings. I have the customer info done with a var message: var message = "Name: " + name + "\n"; message += "Address: " + address + "\n"; message += "City: " + city + "\n"; message += "State: " + state + "\n"; message += "Zip: " + zip + "\n"; message += "Phone: " + phone + "\n"; message += "Email: " + email + "\n"; I know I need to add IF statements to this for the sizes and toppings but do now know where to put them. here is my whole script if that helps: function validate_form() { valid = true; if (document.PizzaForm.customer.value == "" ) { alert ( "Please fill in the 'Name' box." ); valid = true; } if (document.PizzaForm.address.value == "" ) { alert ( "Please fill in the 'Address' box." ); valid = false; } if (document.PizzaForm.city.value == "" ) { alert ( "Please fill in the 'City' box." ); valid = false; } if (document.PizzaForm.state.value == "" ) { alert ( "Please fill in the 'State' box." ); valid = false; } if (document.PizzaForm.zip.value == "" ) { alert ( "Please fill in the 'Zip' box." ); valid = false; } if (document.PizzaForm.phone.value == "" ) { alert ( "Please fill in the 'Phone' box." ); valid = false; } if (document.PizzaForm.email.value == "" ) { alert ( "Please fill in the 'Email' box." ); valid = false; } if ( ( document.PizzaForm.sizes[0].checked == false ) && ( document.PizzaForm.sizes[1].checked == false ) && ( document.PizzaForm.sizes[2].checked == false ) && ( document.PizzaForm.sizes[3].checked == false ) ) { alert ( "Please choose your Size" ); valid = false; } if ( ( document.PizzaForm.toppings[0].checked == false ) && ( document.PizzaForm.toppings[1].checked == false ) && ( document.PizzaForm.toppings[2].checked == false ) && ( document.PizzaForm.toppings[3].checked == false ) && ( document.PizzaForm.toppings[4].checked == false ) && ( document.PizzaForm.toppings[5].checked == false ) && ( document.PizzaForm.toppings[6].checked == false ) && ( document.PizzaForm.toppings[7].checked == false ) ) { alert ( "Please choose your Toppings" ); valid = false; } return valid; } function orderDetails() { var name = document.PizzaForm.customer.value; var address = document.PizzaForm.address.value; var city = document.PizzaForm.city.value; var state = document.PizzaForm.state.value; var zip = document.PizzaForm.zip.value; var phone = document.PizzaForm.phone.value; var email = document.PizzaForm.email.value; var message = "Name: " + name + "\n"; message += "Address: " + address + "\n"; message += "City: " + city + "\n"; message += "State: " + state + "\n"; message += "Zip: " + zip + "\n"; message += "Phone: " + phone + "\n"; message += "Email: " + email + "\n"; alert(message) return; } function doSubmit() { if (validate_form() == true) { orderDetails(); } } Thank you! Here's my script wher problem occurs: Code: $.post('do/register.php?username='+('#username').value, function(result) { if(result == 1) { $('#message').html("Everything's ok"); } else if(result == 2) { $('#message').html("Username is missing."); } else { $('#message').html("What the hell is wrong here?!"); } }); If i put alert(result); in function(result){ } part, i get "result" value that is '1' and that is correct value but it seems like IF statement is not recognizing it at all... #message div constantly shows me "What the hell is wrong here?!" message... Anyone know what could cause this problem? Thanks in advance, phpStud. like for example i have text areas named upload1 and upload2 when I click or add input on upload1 a drop down list below upload2 will not change, but when I add input on upload2 the dropdown will select "parts" Hello everyone, I am using javascript and I have a radio button that the user selects and I have a function to see which button was selected, but i'm trying to use the return of that if statement in another statement. Basically another part of the function is dependent on what the user selects in the radio button. Here is what I have so far (I have some things in there that might not work because i'm trying to figure out what works): Code: <script type="text/javascript"> function getSelectedRadio() { len = document.dates.dep.length // returns the array number of the selected radio button or -1 if no button is selected if (document.dates.dep[0]) { // if the button group is an array (one button is not an array) for (var i=0; i<len; i++) { if (document.dates.dep[i].checked) { return i } } } else { if (document.dates.dep.checked) { return 0; } // if the one button is checked, return zero } // if we get to this point, no radio button is selected return -1; } function Calculate() { var i = getSelectedRadio(); if (i == -1) { alert("Please select if Marine entered Delayed Entry Program"); } else { if (document.dates.dep[i]) { return document.dates.dep[i].value; } else { return document.dates.dep.value; } } if (document.dates.yearDEAF.value < 1985 && document.dates.monthDEAF.value < 01 && document.dates.dayDEAF.value < 01 && first return from above ) { document.dates.yearDEP.value = (document.dates.yearDEAF.value); document.dates.monthDEP.value = (document.dates.monthDEAF.value); document.dates.dayDEP.value = (document.dates.dayDEAF.value); document.dates.yearPEBD.value = (document.dates.yearDEAF.value); document.dates.monthPEBD.value = (document.dates.monthDEAF.value); document.dates.dayPEBD.value = (document.dates.dayDEAF.value); } else if (document.dates.yearDEAF.value < 1985 && document.dates.monthDEAF.value < 01 && document.dates.dayDEAF.value < 01 && second return from above ) { document.dates.yearPEBD.value = (document.dates.yearAFADBD.value); document.dates.monthPEBD.value = (document.dates.monthAFADBD.value); document.dates.dayPEBD.value = (document.dates.dayAFADBD.value); document.dates.yearDEP.value = "N/A"; document.dates.monthDEP.value = "N/A"; document.dates.dayDEP.value = "N/A"; } } </script> I color coded in red the returns i'm trying to reference and where they need to be. Is this possible, and if so how can I do it? I haven't been able to find anything on the internet so far. Any help is greatly appreciated! My form generates 1 to n records which contains check boxes. Based on some condition if I click a check box it has to check & disable some other check boxes automatically. I did it. But, at the same time if I un-check I have to un-check all the check boxes which were checked. Please let me know. Thanks a lot.
Hi all. I have the following problem that I require a pointer with. I have a php variable named "$seatid" This could contain 1 or many entries. I have a page full of checkboxes named A1-8, B1-8, C1-8 etc to P1-8 I want a way of greying out the checkboxes on the page that relate to the values that are contained in the php variable. So they cannot be clicked. It would also like to change the colour of the cell that the check box is contained in. It is important that the checkboxes or at least the table that contain the checkboxes remain, as it represents the layout of a theatre. Cheers for your help All, I have the following code which validates a form has at least one checkbox checked before it submits it. However I want to make sure that there aren't more then 25 checked on the page. How can I do this? Code: function validate(field) { for (var i = 0; i < field.length; i++){ if(field[i].checked){ // if a field is checked form is submitted return true; } } alert("You need to have a check box selected to submit the form!"); return false; // if no fields are checked form not submitted } Thanks in advance! have a simple calculator i made with checkboxes and some Js. the problem is that it does not work in FF. any idea how this can work for IE Safari AND FF Code: function getPrice(amount, boxName){ total = eval() ; checked = document.getElementById(boxName).checked if (checked){ total = parseFloat(form1.Total2.value) + parseFloat(amount); }else{ total = parseFloat(form1.Total2.value) - parseFloat(amount); } total.toFixed(2); form1.Total2.value = total document.getElementById("total").innerHTML = "Total $"+total; } Good evening all, I have a bit of an issue with checkboxes - basically I need to allow only 1 selection and then have a comments box show when a checkbox is checked. I've gotten the comments box to show when the checkbox is checked but I can't seem to workout how to allow only one. I'd really like the user to be able to change their mind and make a different selection but only have 1 be selected at a time (sort of like radio buttons work). I know it would be much easier and probably better to use radio buttons but that isn't an option with this. (The actual HTML is produced using a style sheet in an application that I am interfacing with so all I can do is use the checkbox.) Here is the code I am using to show or hide the comments box. Code: function HideComments() { var a1 = document.getElementById("crmForm_answer1").checked; var a8 = document.getElementById("crmForm_answer8").checked; var a2 = document.getElementById("crmForm_answer2").checked; var a3 = document.getElementById("crmForm_answer3").checked; var a4 = document.getElementById("crmForm_answer4").checked; var a5 = document.getElementById("crmForm_answer5").checked; var a6 = document.getElementById("crmForm_answer6").checked; var a7 = document.getElementById("crmForm_answer7").checked; var a9 = document.getElementById("crmForm_answer9").checked; var a10 = document.getElementById("crmForm_answer10").checked; if(a1==true) { document.getElementById("crmForm_answer1_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer1_value").parentNode.parentNode.style.display = 'none'; if(a8==true) { document.getElementById("crmForm_answer8_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer8_value").parentNode.parentNode.style.display = 'none'; if(a2==true) { document.getElementById("crmForm_answer2_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer2_value").parentNode.parentNode.style.display = 'none'; if(a3==true) { document.getElementById("crmForm_answer3_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer3_value").parentNode.parentNode.style.display = 'none'; if(a4==true) { document.getElementById("crmForm_answer4_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer4_value").parentNode.parentNode.style.display = 'none'; if(a5==true) { document.getElementById("crmForm_answer5_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer5_value").parentNode.parentNode.style.display = 'none'; if(a6==true) { document.getElementById("crmForm_answer6_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer6_value").parentNode.parentNode.style.display = 'none'; if(a7==true) { document.getElementById("crmForm_answer7_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer7_value").parentNode.parentNode.style.display = 'none'; if(a9==true) { document.getElementById("crmForm_answer9_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer9_value").parentNode.parentNode.style.display = 'none'; if(a10==true) { document.getElementById("crmForm_answer10_value").parentNode.parentNode.style.display = 'block'; } else document.getElementById("crmForm_answer10_value").parentNode.parentNode.style.display = 'none'; } Thanks in Advance Sam I have a group of checkboxes named "list[]". I want to validate that at least one is checked. How can I do this?
irst post here, i'll try to be simple: I need to create a form where participants of a medical convention register to classes, each class lasts 3 hours, so a person who wants to attend to class starting at 10 am cannot register to 11 am, 12pm and 1pm classes, but he can register to 2pm and so on. There are 3 different classes per hour. i thought doing this using javascript, but i'm absolutely lost. Can you please give me a hint on how to do this? Thanks!! this is the part of the form that has the checkboxes. <form method="post" action="process.php"></form> <input type="checkbox" value="101" name="convention1"> 10 am: Cariovascular desease<br> <input type="checkbox" value="102" name="convention2"> 10 am: Changes on toracic surgeon<br> <input type="checkbox" value="103" name="convention3"> 10 am: New drugs on heart<br> <input type="checkbox" value="111" name="convention4"> 11 am: New drugs on heart (II)<br> <input type="checkbox" value="112" name="convention5"> 11 am: Dynamic process on blood pressure<br> <input type="checkbox" value="113" name="convention6"> 11 am: Aortic disease<br> <input type="checkbox" value="121" name="convention7"> 12 am: Pulmonar Pressure<br> <input type="checkbox" value="122" name="convention8"> 12 am: Open table<br> <input type="checkbox" value="131" name="convention9"> 1 pm: Neurological aspects on heart rate<br> <input type="checkbox" value="132" name="convention10"> 1 pm: Cardiovascular disease (II)<br> <input type="checkbox" value="133" name="convention11"> 1 pm: Mioresponse on heart failure<br> <input type="checkbox" value="141" name="convention12"> 2 pm<br> <input type="checkbox" value="142" name="convention13"> 2 pm<br> <input type="checkbox" value="143" name="convention14"> 2 pm<br> <input type="checkbox" value="151" name="convention15"> 3 pm<br> <input type="checkbox" value="152" name="convention16"> 3 pm<br> <input type="checkbox" value="153" name="convention17"> 3 pm<br> <input type="submit"></input> </form> This script works via "elem.checked" which is great for checkboxes (see http://javascript.internet.com/forms...heckboxes.html), but I need it to work with image buttons instead where there is no "checking" going on. Is this possible? I tried elem.onclick and elem.clicked but neither works. I don't know enough about onclick conditionals. Please help. Code: function UpdateCost() { var sum = 0; var gn, elem; for (i=0; i<4; i++) { gn = 'game'+i; elem = document.getElementById(gn); if (elem.checked == true) { sum += Number(elem.value); } } document.getElementById('totalcost').value = sum.toFixed(2); } tl;dr: Want to make the above work with <a onclick="UpdateCost()"><img></a>, not <input type="checkbox" onclick="UpdateCost()"> Hi, I have a few checkboxes in a form. Some of them work independently, but some make the others go on and off. Specifically the lower ones are controlling the upper ones. Can anyone explain why please? Code: <td> <input type="checkbox" name="weddingitem1" value="Toppers" id="Toppers"/><label for="Toppers" >Toppers<br /> <input type="checkbox" name="weddingitem2" value="Champers" id="Champers"/><label for="Champers" >Champers<br /> </td> Hello, today I am trying to allow a user to easily uncheck/check all checkboxes in a form by checking or unchecking a checkbox. The checkboxes would be in a form like so: Code: <form action="" method="post"> <input type="checkbox" name="checked[]" value="1"> <input type="checkbox" name="checked[]" value="2"> <input type="checkbox" name="checked[]" value="3"> <input type="checkbox" name="checked[]" value="4"> </form> I use an event handler to call a function: Code: <input type="checkbox" name="checkall" onchange="checkall('checked[]', this.checked)"> And here is the function: Code: function checkall(box_name, current_state) { all = document.getElementsByName(box_name); action = (current_state == "checked") ? "false" : "true"; for (i = 0; i < all.length; i++) { all[i].checked=action; } } The event handler should pass the name of the checkboxes and whether the "check all" checkbox is currently checked or not to the checkall() function. Nothing happens when I check/uncheck the "check all" function. Help? |