JavaScript - If Checked
So I have a form.
Unfortunately, I'm not using a <form> tag, it's all div. Code: <div id="mainForm"> <div class="label"><input type="checkbox" id="LeftFixed" />Left Bar Always On Screen</div> What I'm trying to do is if that box is checked, execute a javascript. How do I do that? so if checked, execute 'sources/leftbar.js' or I could even just copy the code so it's inline, and not called. Is there a way to do this? Similar TutorialsHello! Thanks in advance for your help. I want to begin with the box checked (Yes, I want to subscribe to magazine) 1. The box is checked then go to email 1 (Thanks for subscribing) 2. The box has been unchecked then go to email 2 (Perhaps you need more info) Pat Sorted. Close thread please. New problem in post below VVV Hi, I'm using JavaScript to check (or leave empty) a checkbox based on stored data. Code: for (var q=0;q<document.Simple.Subject.length;q++) { if (document.Simple.Subject[q].value == document.Restored.Subject.value) { document.Simple.Subject[q].checked = true; break; } It works perfectly, but I've discovered that it adds a simple "checked" to the form: Code: <input type="checkbox" name="Subject" value="Math" checked /> ... I thought I read that checked is not proper... it the attribute should really be checked="checked" . Is there a way to tweak this with JavaScript? Thanks. ~Wayne Thanks for clicking on this to possibly help me. I've been trying for hours to get my page to do one calculations when a radio is clicked... or to do another if a different radio is clicked. any help would be GREATLY appreciated. here is a simplified version of the code (it'd be pointless to give you the whole code, it's way too big.) Code: <html> <head> <title>This doesn't work...</title> </head> <body> <script type="text/javascript"> function doit(){ var firstnum = form.num1.value - form.num2.value; var secondnum = form.num1.value + form.num2.value; if (form.op1.checked){ form.results.value = firstnum; } if (form.op2.checked){ form.results.value = secondnum; } } </script> <form name="form" method="post"> Num 1: <input type="text" name="num1" /><br /> Num 2: <input type="text" name="num2" /><br /> Option One <input type="radio" name="op1" /><br /> Option Two <input type="radio" name="op2" /><br /> <input type="submit" onClick="doit" /><br /> Results: <input type="text" name="results" /><br /> </form> </body> </html> hi i was wondering if there was anyway i can check a check box with the help of javascript and have it add text from a database record to a text box without submitting the page with the help from php? i have the php coding done to get the info and edit it but cant have no idea how to do the javascript code thanks. PHP code: PHP 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>Untitled Document</title> </head> <body> <div id="user_pm"> <?php $sql="SELECT * FROM list WHERE username='usernamehere'"; $result=mysql_query($sql); $count=mysql_num_rows($result); ?> <table width="496" border="0" cellspacing="1" cellpadding="0"> <tr> <td><form name="form1" method="post" action=""> <table width="495" border="0" cellpadding="3" cellspacing="1" bgcolor="#000000"> <tr> <td align="left" bgcolor="#3576B4" width="26"><font color="#FFFFFF" size="2"><strong></strong></td> <td align="left" bgcolor="#3576B4" width="95"><font color="#FFFFFF" size="2"><strong>From:</strong></font></td> <td align="left" bgcolor="#3576B4" width="52"><font color="#FFFFFF" size="2"><strong>To:</strong></font></td> <td align="left" bgcolor="#3576B4" width="161"><font color="#FFFFFF" size="2"><strong>Message:</strong></font></td> </tr> <?php while($rows=mysql_fetch_array($result)){ ?> <tr> <td align="center" bgcolor="#f8f8f8" width="26"> <input name="checkbox[]" type="checkbox" id="checkbox[]" value="<?php echo $rows['id']; ?>" style="float: left"></td> <td bgcolor="#f8f8f8" width="95"><font size="2"><?php echo $rows['from']; ?></font></td> <td bgcolor="#f8f8f8" width="52"><font size="2"><?php echo $rows['to']; ?></font></td> <td bgcolor="#f8f8f8" width="161"><font size="2"><?php echo $rows['message']; ?></font></td> </tr> <?php } ?> <tr> <td colspan="6" align="center" bgcolor="#f8f8f8"> <input name="edit" type="submit" id="edit" value="Edit" style="float: left"></td> </tr> <?php $message = stripslashes($post['message']); $message = $_POST['message']; $checkbox = $_POST['checkbox']; $edit = $_POST['edit']; if($edit){ for($i=0;$i<$count;$i++){ $edit_id = $checkbox[$i]; mysql_query("UPDATE list SET message='$message' WHERE id='$edit_id' And username='usernamehere'"); } if($result){ echo "<meta http-equiv=\"refresh\" content=\"0;url=index.php\">\n"; } } mysql_close(); ?> </table> </form> </td> </tr> </table> </div> </body> </html> I am using 2-3 checkboxes in my VB.Net program.When I run the code in Firefox, I can not check or uncheck the checkboxes.I am using firebug,Still it does not show any error. It works fine in google Chrome.. Plz reply......... Can someone please help, I don't understand why my code doesn't work?! I just want to check to see if a checkbox has been checked... Code: <script language="JAVASCRIPT" type="text/djs"> function checkCheckBoxes() { if (document.f1.Times[].checked == false { alert ('You didn\'t choose any of the checkboxes!'); return false; } else { return true; } } </script> <form onsubmit="return checkCheckBoxes();" action="add-booking-script.php" name="f1" method="post"> <input type="checkbox" name="Times[]" value="07:00:00"> 07:00 - 10:00<br /> <input type="checkbox" name="Times[]" value="10:00:00"> 10:00 - 13:00<br /> <input type="checkbox" name="Times[]" value="13:00:00"> 13:00 - 16:00<br /> <input type="checkbox" name="Times[]" value="16:00:00"> 16:00 - 19:00<br /> </form> Is it possible to send a checkbox value to the DB when checked and or unchecked. I mean when you Physically chage it's state. I am running a PHP project, the page I need this functionality on has a dynamically built table from the Database. What I need to do is send the value "1" to the DB if I check on one of the rows "Published" checkbox and vice versa, removing the value of 1 from the db and changing the state to unchecked. The reason I ask in the JS forum is that PHP is a server side language and as such may not submit the change in realtime. Any help and or suggestions is much appreciated. I'm trying to find the best approach for saving the checked value of a checkbox in SQL With this script the FieldName "Active" toggles yes/no onClick... That we can post to the database no problem... What I am having trouble with is saving the checked value. I want to make the FieldName Active =hidden, and only display the checkbox with correct value checked yes/no. Code: <script type="text/javascript"> var YesOrNo = (function() { if(document.select.checkbox.checked) { document.select.Active.value = 'yes'; } else { document.select.Active.value = 'no'; } }); </script> <form name="select"> <input type="hidden" name="Active" size="10" /> <input type="checkbox" name="checkbox" onclick="YesOrNo();" value="on" /> </form> Hi I am very new to Javascript and I was wondering if anyone could help. This is my jQuery code: Code: $(document).ready(function(){ if("input.cf_flt:checked") { $(".filterbox").show() } else { $(".filterbox").hide() } $(".filtertoggle").click(function() { $(this).next(".filterbox").slideToggle(500); }); }); HTML (sorry, quite a lot) Code: <h3 class="filtertoggle">Filter These Results <span>Click Here</span></h3> <div class="filterbox"> <form name="cf_form" action="index.php" method="get" class="cf_form topfilter"> <div class="cf_flt_wrapper"> <div class="cf_flt_header" id="cfhead_0"> Grape </div> <div class="cf_wrapper_inner" id="cf_wrapper_inner_0"> <ul class="cf_filters_list"><li><input onclick="window.location='/eden/index.php?custom_f_17[0]=50726f63616e69636f2c2056657264656c6c6f2c2047726563686574746f2c204d616c766173696120546f7363616e61&option=com_customfilters&view=products';" type="checkbox" name="custom_f_17[]"class="cf_flt" id="flt_50726f63616e69636f2c2056657264656c6c6f2c2047726563686574746f2c204d616c766173696120546f7363616e61" value="50726f63616e69636f2c2056657264656c6c6f2c2047726563686574746f2c204d616c766173696120546f7363616e61" /><label class="" for="flt_50726f63616e69636f2c2056657264656c6c6f2c2047726563686574746f2c204d616c766173696120546f7363616e61"><a href="/eden/index.php?custom_f_17[0]=50726f63616e69636f2c2056657264656c6c6f2c2047726563686574746f2c204d616c766173696120546f7363616e61&option=com_customfilters&view=products" class="cf_option ">Procanico, Verdello, Grechetto, Malvasia Toscana</a></label></li><li><input onclick="window.location='/eden/index.php?custom_f_17[0]=53616e67696f76657365&option=com_customfilters&view=products';" type="checkbox" name="custom_f_17[]"class="cf_flt" id="flt_53616e67696f76657365" value="53616e67696f76657365" /><label class="" for="flt_53616e67696f76657365"><a href="/eden/index.php?custom_f_17[0]=53616e67696f76657365&option=com_customfilters&view=products" class="cf_option ">Sangiovese</a></label></li></ul> </div> </div> <div class="cf_flt_wrapper"> <div class="cf_flt_header" id="cfhead_1"> Bottle Size </div> <div class="cf_wrapper_inner" id="cf_wrapper_inner_1"> <ul class="cf_filters_list"><li><input onclick="window.location='/eden/index.php?custom_f_18[0]=3735636c&option=com_customfilters&view=products';" type="checkbox" name="custom_f_18[]"class="cf_flt" id="flt_3735636c" value="3735636c" /><label class="" for="flt_3735636c"><a href="/eden/index.php?custom_f_18[0]=3735636c&option=com_customfilters&view=products" class="cf_option ">75cl</a></label></li></ul> </div> </div> <div class="cf_flt_wrapper"> <div class="cf_flt_header" id="cfhead_2"> ABV </div> <div class="cf_wrapper_inner" id="cf_wrapper_inner_2"> <ul class="cf_filters_list"><li><input onclick="window.location='/eden/index.php?custom_f_16[0]=31322e3525&option=com_customfilters&view=products';" type="checkbox" name="custom_f_16[]"class="cf_flt" id="flt_31322e3525" value="31322e3525" /><label class="" for="flt_31322e3525"><a href="/eden/index.php?custom_f_16[0]=31322e3525&option=com_customfilters&view=products" class="cf_option ">12.5%</a></label></li><li><input onclick="window.location='/eden/index.php?custom_f_16[0]=313325&option=com_customfilters&view=products';" type="checkbox" name="custom_f_16[]"class="cf_flt" id="flt_313325" value="313325" /><label class="" for="flt_313325"><a href="/eden/index.php?custom_f_16[0]=313325&option=com_customfilters&view=products" class="cf_option ">13%</a></label></li><li><input onclick="window.location='/eden/index.php?custom_f_16[0]=31332e3525&option=com_customfilters&view=products';" type="checkbox" name="custom_f_16[]"class="cf_flt" id="flt_31332e3525" value="31332e3525" /><label class="" for="flt_31332e3525"><a href="/eden/index.php?custom_f_16[0]=31332e3525&option=com_customfilters&view=products" class="cf_option ">13.5%</a></label></li></ul> </div> </div> <div class="cf_flt_wrapper"> <div class="cf_flt_header" id="cfhead_3"> Vintage </div> <div class="cf_wrapper_inner" id="cf_wrapper_inner_3"> <ul class="cf_filters_list"><li><input onclick="window.location='/eden/index.php?custom_f_15[0]=32303038&option=com_customfilters&view=products';" type="checkbox" name="custom_f_15[]"class="cf_flt" id="flt_32303038" value="32303038" /><label class="" for="flt_32303038"><a href="/eden/index.php?custom_f_15[0]=32303038&option=com_customfilters&view=products" class="cf_option ">2008</a></label></li><li><input onclick="window.location='/eden/index.php?custom_f_15[0]=32303130&option=com_customfilters&view=products';" type="checkbox" name="custom_f_15[]"class="cf_flt" id="flt_32303130" value="32303130" /><label class="" for="flt_32303130"><a href="/eden/index.php?custom_f_15[0]=32303130&option=com_customfilters&view=products" class="cf_option ">2010</a></label></li></ul> </div> </div> <input type="hidden" name="option" value="com_customfilters" /> <input type="hidden" name="view" value="products" /> </form> </div> Basically if the checkbox with a class of cf_flt is checked then I want the div '.filterbox' to show. if the checkbox is unchecked then I want it to hide. As well as this I have a toggle button called '.filtertoggle' which toggles the '.filterbox' At the moment the '.filterbox' shows regardless of whether or not the checkbox is checked. The toggle button works correctly. If you know how to fix this then I would be very grateful. Thank you. got 3 groups of radio buttons that, if not all checked, needs to give an alert message when button clicked to continue. The button is not a submit button, but just to continue to the next part of the form which is hidden. Code: <!-- MY RADIO BUTTON GROUPS --> <input name="id[18]" value="81" id="attrib-18-81" type="radio"><label class="attribsRadioButton zero" for="attrib-18-81"> Kola Cubes</label><br /> <input name="id[18]" value="82" id="attrib-18-82" type="radio"><label class="attribsRadioButton zero" for="attrib-18-82"> Pineapple Cubes</label><br /> <input name="id[18]" value="79" id="attrib-18-79" type="radio"><label class="attribsRadioButton zero" for="attrib-18-79"> Rhubarb and Custard</label><br /> <input name="id[18]" value="80" id="attrib-18-80" type="radio"><label class="attribsRadioButton zero" for="attrib-18-80"> Strawberry and Cream</label><br /><br /> <input name="id[19]" value="99" id="attrib-19-99" type="radio"><label class="attribsRadioButton zero" for="attrib-19-99"> Kola Cubes</label><br /> <input name="id[19]" value="100" id="attrib-19-100" type="radio"><label class="attribsRadioButton zero" for="attrib-19-100"> Pineapple Cubes</label><br /> <input name="id[19]" value="97" id="attrib-19-97" type="radio"><label class="attribsRadioButton zero" for="attrib-19-97"> Rhubarb and Custard</label><br /> <input name="id[19]" value="98" id="attrib-19-98" type="radio"><label class="attribsRadioButton zero" for="attrib-19-98"> Strawberry and Cream</label><br /><br /> <input name="id[20]" value="117" id="attrib-20-117" type="radio"><label class="attribsRadioButton zero" for="attrib-20-117"> Kola Cubes</label><br /> <input name="id[20]" value="118" id="attrib-20-118" type="radio"><label class="attribsRadioButton zero" for="attrib-20-118"> Pineapple Cubes</label><br /> <input name="id[20]" value="115" id="attrib-20-115" type="radio"><label class="attribsRadioButton zero" for="attrib-20-115"> Rhubarb and Custard</label><br /> <input name="id[20]" value="116" id="attrib-20-116" type="radio"><label class="attribsRadioButton zero" for="attrib-20-116"> Strawberry and Cream</label><br /><br /> <!-- MY CONTINUE BUTTON --> <img src="images/tabs/button_continue.gif" alt="CONTINUE" onclick="Tabdoc_ManageDisplay(4)"> The onClick function on the image is to hide these and display next part of form. I understand that I could just check them automatically to force user to change them if they wanted to or just continue but if there is way to do it another way, please let me know. Or if possible to hide my continue button until all 3 groups are selected, also without using checked="checked" Thanks in advance. ----------------- Jay Hi, Have searched the forum and found a soloution that probably only needs some modification. I have a number of question with related alternatives in a db that I display on a webpage. I wan't to force the user to select an alternative. I use checkboxes because sometimes more then one answer is correct. I have found a bit of code that lets me do this. The problem is that sometimes the alterative to the question is 3 and sometimes 5 (I don't know beforehand how many alterantives a question has). So is there a way to modify the code to work if there are 3 checkboxes or 5 checkboxes and so on...? The code below only works with a fixed number of alternatives. Code: <form action="../" onsubmit="return checkCheckBoxes(this);"> <p><input type="CHECKBOX" name="CHECKBOX_1" value="This..."> This...</p> <p><input type="CHECKBOX" name="CHECKBOX_2" value="That..."> That...</p> <p><input type="CHECKBOX" name="CHECKBOX_3" value="...and The Other"> ...and The Other</p> <p><input type="SUBMIT" value="Submit!"></p> </form> Code: <script type="text/javascript" language="JavaScript"> <!-- function checkCheckBoxes(theForm) { if ( theForm.CHECKBOX_1.checked == false && theForm.CHECKBOX_2.checked == false && theForm.CHECKBOX_3.checked == false) { alert ('You didn\'t choose any of the checkboxes!'); return false; } else { return true; } } //--> </script> Hi, I have a check-box in a form Code: <input name="agreea1" type="checkbox" value="true" checked="checked" /> I expect most people to agree to pay a membership fee and leave it checked. I validate the check on submit like this Code: if(frm4.agreea1.checked) {subs1=12.5; alert ("Thank you " + name1 + " for paying your membership");} else {subs1=0; alert (name1 +" Please make sure you pay your membership by another method."+'\n' +"You will not be admitted to camp without paying.");}; The check-box appears checked when I test locally, but appears unchecked when on the server. I dont refer to the check-box name anywhere else in my code or on the form What is happening. I use a JavaScript form field validator; I have some multi-select checkboxes on a form (check as many that apply). For instance, if you tick the box that says you have a car, it requires you to list list the "Model" in another form field. This works: Code: function formCheckCar(formobj) { if ( formobj.elements['Car].checked && formobj.elements['Model'].value == '' ) { alert('Error: Provide model of your car'); return false; } return true; } How would I modify this if I wanted the alert triggered if the checkbox was NOT ticked? I took a few stabs at it, tired this: Code: if ( formobj.elements['Car].unchecked and Code: if ( formobj.elements['Car].!=checked No dice. Thank you. hello I have a list of checkbox called de[] i use [] for create array in php so i have a button called "delete" so i want to activate the button if almost one of checkbox has been checked other way the input button will be disable. sorry for my english jejejeje. Regards hi guys, i need a javascript for my checkbox 1st: need to check the checkbox to go to next page or else stay at current page with an alert popout "Please check the checkbox" can some one help me please? I have a JS that works, but only on the first Dynamically created check box and once the colour has chaned it wont change back when clicked again Please inspect my code to see exactly what I mean ... Code: <?php function create_time_range($start, $end, $by='30 mins') { $start_time = strtotime($start); $end_time = strtotime($end); $times = array(); for ( ;$start_time < $end_time; ) { $times[] = $start_time; $start_time = strtotime('+'.$by, $start_time); } $times[] = $start_time; return $times; } // create array of time ranges $times = create_time_range('0:00', '23:00', '1 hour'); // $times = create_time_range('9:30am', '5:30pm', '30 mins'); // format the unix timestamps foreach ($times as $key => $time) { $times[$key] = date('H:i', $time); } //print '<pre>'. print_r($times, true).'</pre>'; $days = array( 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', ); $s_day = array( 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', ); ?> <!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>Untitled Document</title> <style type="text/css"> legend{ font-family:Arial, Helvetica, sans-serif; font-size:12px; } fieldset{ width:300px; height:auto; } label{ font-family:Arial, Helvetica, sans-serif; font-size:9px; display:inline-table; width:50px; } .short{ font-family:Arial, Helvetica, sans-serif; font-size:9px; display:inline-table; width:15px; } .on_lbl{ font-family:Arial, Helvetica, sans-serif; font-size:9px; display:inline-table; width:100px; } #myfield{ display: none; } #Toptions{ } </style> <script type="text/javascript"> function disshow(num) { var dayname = new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'); document.getElementById('legend').innerHTML = dayname[num]; document.getElementById('myfield').style.display = 'block'; } /* Color Changes*/ function changeColour () { if (document.getElementById('Toptions').style.backgroundColor=='green') { document.getElementById('Toptions').style.backgroundColor='red' } else if (document.getElementById('Toptions').style.backgroundColor=='red') { document.getElementById('Toptions').style.backgroundColor=='green' } } </script> </head> <body> <?php // Days Active echo("<form method=\"POST\">"); echo("<fieldset><legend>Days Active</legend>"); for ($i=0; $i<sizeof($days); $i++){ echo("<div class=\"on_lbl\"> <input type=\"checkbox\" name=\"dayOption\" value=\"" . $i . "\" id=\"option" . $i . "\"> <label for=\"option" . $i . "\">" . $days[$i] . "</label> </div>"); } echo ("</fieldset>"); // Select Days for Schedule echo ("<fieldset><legend>Schedule Times</legend>"); for ($i=0; $i<sizeof($s_day); $i++) { echo("<input type=\"radio\" name=\"sdayOption\" value=\"" . $i . "\" id=\"opt" . $i . " \" onclick=\"disshow('$i')\"> <label class=\"short\">$s_day[$i]</label>"); } echo("</fieldset>"); // Day: Schedule show Hours echo "<div id=\"myfield\">"; echo("<fieldset><legend id=\"legend\">day</legend>"); for ($i=0; $i<sizeof($times); $i++) { echo("<span id=\"Toptions\" style=\"background-color:green;\"><input type=\"checkbox\" name=\"timeOption\" checked=\"checked\" value=\"" . $i . "\" id=\"Toption" . $i . "\" onClick=\"changeColour()\"> <label for=\"timeOption" . $i . "\">" . $times[$i] . "</label></span>"); } //<input type=\"submit\" value=\"Save\"> echo ("</fieldset>"); echo ("<input type=\"submit\" value=\"Update\"><input type=\"submit\" value=\"Check All\"></form>"); echo "</div>"; ?> </body> </html> I am at my wits end and have spent over 2 hours looking into this... Need a javascript function... If a checkbox is checked, then corresponding dropdown selection is must... Please help me with this... Thanks Reply With Quote Hi, I'm having problems getting the values of selected checkboxes and outputting them to a textarea. This seems like quite a simple thing to do but its causing me a lot of bother! I am using a mixture of JavaScript and jQuery to find a solution to this. Code: <h2>Booking Form</h2> <form name="booking"> Please choose the days that would suit your visit: <br/> <input type="checkbox" name="days" value="Monday">Monday<br/> <input type="checkbox" name="days" value="Tuesday">Tuesday<br/> <input type="checkbox" name="days" value="Wednesday">Wednesday<br/> <input type="checkbox" name="days" value="Thursday">Thursday<br/> <input type="checkbox" name="days" value="Friday">Friday<br/> </form> <textarea id="output"> </textarea> Code: var values = $("#days").val() || []; $("p#ss").html("<strong>Checked values:</strong> " + values.join(", ")); //This just outputs "Checked values:" to the paragraph 'ss' that I created just to test it this way. Help with this would be appreciated. |