JavaScript - Javascript For Radio Button Onclick
I am very new Beginner of Javascript..
My query is that 1)I have 2 radio buttons A and B 2)When I click A I want 2 dropdownbox and a button to be displayed 3)When I click B I want 2 dropdownbox to be displayed. 4)Both should be independent Plz tell me the code..for this Similar TutorialsAs the code example below shows, I have three radio buttons that perform an javascript action when selected. Code: <script language="javascript"> function OnProductClick(product) { if (product.value == "Car") { // do something } else if (product.value == "Boat") { // do something else.. } else if (product.value == "Train") { // do else } } </script> <p>Select option <input type="radio" name="product" onclick="OnProductClick(this)" value="Car">Car</input> <input type="radio" name="product" onclick="OnProductClick(this)" value="Boat"> Boat</input> <input type="radio" name="product" onclick="OnProductClick(this)" value="Train">Train</input> </p> This setup is triggerred by a click, clicking multiple times on the same radio button will yield multiple calls to the OnProductClick function. This last part is what I would like to prevent. Say a user selects the option 'car' and then for some reason clicks on the same option again, this will lead to the OnProductClick function being executed twice. How can I prevent the second execution? hi guys im trying to check whether a radio button is checked when i click it, but the javascript onlick event is not acting cool! when i click an unselected radio button i am informed that the unselected radio button i just clicked is in fact checked, when i should be getting the information the no, the radio button was not checked when i clicked it. any idea how to get the previous state of a radio button onclick? Hi there, I'm soo stuck on particular piece of code.. You see i have 2 radio buttons with values 12hr and 24hr; on clicking any of the above the time format should change automatically. by default the time format comes in 12hr format against onload event of <body>. I've tried using javascript but this problem is persisting... Can anyone help me pleassssse.. I just started my javascript class two weeks ago and am having troubles already and my book is no help. My first assignment is having a list of country names and when you click the radio button next to the name the country flag pops up in a designated area for the image. I have tried a few different things but nothing is working. I have the list of countrys and the radio buttons but when i click the radio button the image doesn't pop up. Also, when i click another radio button they all stay selected. Greetings! I'm trying to disable some form elements using the onclick from a radio input element. It ain't working so great! I googled around and finally scraped together some code that in theory 'I' think should work. I'm no javascript guru! It has to be some tiny tiny thing I'm missing. Here's my code and mind you this is a project in the making! I still have along way to go! Thanks for you time and help! 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" xml:lang="en"> <head> <title>Empty Page</title> <script type='text/javascript'> function setReadOnly(obj) { if(obj.value == "1") { document.shiftreport.artprogs.disabled = true; document.shiftreport.artprog_stat.disabled = true; } else { document.shiftreport.icprogs.disabled = true; document.shiftreport.icprog_stat.disabled = true; } } </script> </head> <body> <?php include_once('form_input_functions.php'); $artprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $artprog_wfls = array('no_job' => '------- select a job -------', 'ARTPROG/WFL/DAILY/BATCH' => 'ARTPROG/WFL/DAILY/BATCH', 'ARTPROG/WFL/OPERATIONS/IMAGE' => 'ARTPROG/WFL/OPERATIONS/IMAGE', 'ARTPROG/WFL/WKLY/BATCH' => 'ARTPROG/WFL/WKLY/BATCH', 'ARTPROG/WFL/DAILY/CLAIMS' => 'ARTPROG/WFL/DAILY/CLAIMS' ); $bllyprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $bllyprog_wfls = array('no_job' => '------- select a job -------', 'BLLYPROG/WFL/DAILY/SISCHEDPAY' => 'BLLYPROG/WFL/DAILY/SISCHEDPAY', 'BLLYPROG/WFL/DAILY/REPORTS' => 'BLLYPROG/WFL/DAILY/REPORTS', 'BLLYPROG/WFL/WKLY/REPORTS/GYPSUM' => 'BLLYPROG/WFL/WKLY/REPORTS/GYPSUM', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', '$UTIL/O/AUDIT/CLOSE/BLLY' => '$UTIL/O/AUDIT/CLOSE/BLLY', 'DATASIWH/EXTRACTALL/DAILY/AUD/WFL' => 'DATASIWH/EXTRACTALL/DAILY/AUD/WFL', ); $sbwcprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $sbwcprog_wfls = array('no_job' => '------- select a job -------', 'WORKPROG/WFL/DAILY/WAREHOUSE' => 'WORKPROG/WFL/DAILY/WAREHOUSE', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', '$UTIL/O/AUDIT/CLOSE/WORKCOMP' => '$UTIL/O/AUDIT/CLOSE/WORKCOMP' ); $tcsprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $tcsprog_wfls = array ('no_job' => '------- select a job -------', 'TCS/WFL/DAILY/BATCH' => 'TCS/WFL/DAILY/BATCH', 'BLPROG/WFL/COPY/REMOVE/GLCHECKS' => 'BLPROG/WFL/COPY/REMOVE/GLCHECKS' ); $icprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $icprog_wfls = array ('no_job' => '------- select a job -------', 'BLPROG/WFL/DAILY/INDCONT' => 'BLPROG/WFL/DAILY/INDCONT', 'INDCON/WFL/PRINT/IDCARDS' => 'INDCON/WFL/PRINT/IDCARDS', 'BLPROG/WFL/BATCH/NEWYORK/STATE-REPORT' => 'BLPROG/WFL/BATCH/NEWYORK/STATE-REPORT' ); $truckprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $truckprog_wfls = array('no_job' => '------- select a job -------', 'TRUCKPROG/WFL/DAILY/TKINTMARSH' => 'TRUCKPROG/WFL/DAILY/TKINTMARSH', 'TRUCKPROG/WFL/DAILY/TKINTERNET' => 'TRUCKPROG/WFL/DAILY/TKINTERNET', 'TRUCKPROG/WFL/DAILY/BATCH' => 'TRUCKPROG/WFL/DAILY/BATCH', 'TRUCKPROG/WFL/DAILY/TKSCHEDPAY' => 'TRUCKPROG/WFL/DAILY/TKSCHEDPAY', 'TRUCKPROG/WFL/DAILY/REPORTS' => 'TRUCKPROG/WFL/DAILY/REPORTS', 'BLPROG/WFL/DAILY/CLAIMS' => 'BLPROG/WFL/DAILY/CLAIMS', 'TRUCKPROG/WFL/DAILY/AUDIT/PREMIUM' => 'TRUCKPROG/WFL/DAILY/AUDIT/PREMIUM', 'TRUCKPROG/WFL/DAILY/BALRPT' => 'TRUCKPROG/WFL/DAILY/BALRPT', 'PROG-MEDICAL/WFL/DAILY/PMCLMEXT' => 'PROG-MEDICAL/WFL/DAILY/PMCLMEXT', 'AGPROG/WFL/DAILY/AGNUCOPREM' => 'AGPROG/WFL/DAILY/AGNUCOPREM', 'BL/WFL/WKLY/FEDEX/0005' => 'BL/WFL/WKLY/FEDEX/0005', 'TRUCKPROG/WFL/WKLY/DE542' => 'TRUCKPROG/WFL/WKLY/DE542', 'TRUCKPROG/WFL/WKLY/FDXDISAB' => 'TRUCKPROG/WFL/WKLY/FDXDISAB', 'TRUCKPROG/WFL/WKLY/FDXDISERR' => 'TRUCKPROG/WFL/WKLY/FDXDISERR', 'BL/WFL/ONLINE/DUMP/TRUCKING' => 'BL/WFL/ONLINE/DUMP/TRUCKING', 'DATATKWH/EXTRACTALL/DAILY/WFL' => 'DATATKWH/EXTRACTALL/DAILY/WFL', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' ); $smallprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $smallprog_wfls = array('no_job' => '------- select a job -------', 'SMALLPROG/WFL/DAILY/BATCH' => 'SMALLPROG/WFL/DAILY/BATCH', 'SMALLPROG/WFL/DAILY/CERTS' => 'SMALLPROG/WFL/DAILY/CERTS', 'SMALLPROG/WFL/OPERATIONS/PRINT' => 'SMALLPROG/WFL/OPERATIONS/PRINT', 'SMALLPROG/WFL/WKLY/BATCH' => 'SMALLPROG/WFL/WKLY/BATCH', 'SFCLAIMS/WFL/DAILY/DWHCLAIMS' => 'SFCLAIMS/WFL/DAILY/DWHCLAIMS', 'SFCLAIMS/WFL/DAILY/REPORTS' => 'SFCLAIMS/WFL/DAILY/REPORTS', 'SFCLAIMS/WFL/WEEKLY/REPORTS' => 'SFCLAIMS/WFL/WEEKLY/REPORTS', 'BL/WFL/ONLINE/DUMP/SFDB/1WORKER' => 'BL/WFL/ONLINE/DUMP/SFDB/1WORKER', '$UTIL/O/AUDIT/CLOSE/SFDB' => '$UTIL/O/AUDIT/CLOSE/SFDB', 'DATASFWH/EXTRACTALL/DAILY/WFL' => 'DATASFWH/EXTRACTALL/DAILY/WFL', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' ); $persauto_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $persauto_wfls = array('no_job' => '------- select a job -------', 'PERSAUTO/WFL/DAILY/BATCH' => 'PERSAUTO/WFL/DAILY/BATCH', 'PERSAUTO/WFL/OPERATIONS/IMAGE' => 'PERSAUTO/WFL/OPERATIONS/IMAGE', 'PERSAUTO/WFL/OPERATIONS/PRINT' => 'PERSAUTO/WFL/OPERATIONS/PRINT', 'PERSAUTO/WFL/WKLY/BATCH' => 'PERSAUTO/WFL/WKLY/BATCH', 'PERSAUTO/WFL/DAILY/CLAIMS' => 'PERSAUTO/WFL/DAILY/CLAIMS', 'BL/WFL/ONLINE/DUMP/DB1/1WORKER/FULL' => 'BL/WFL/ONLINE/DUMP/DB1/1WORKER/FULL', '$UTIL/O/AUDIT/CLOSE/DB1' => '$UTIL/O/AUDIT/CLOSE/DB1', 'DATAWH/EXTRACTALL/DAILY/WFL' => 'DATAWH/EXTRACTALL/DAILY/WFL', 'BL/WFL/OFFLINE/DUMP/WAREHOUSE' => 'BL/WFL/OFFLINE/DUMP/WAREHOUSE' ); $isoprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $isoprog_wfls = array('no_job' => '------- select a job -------', 'ISOPROG/WFL/BATCH/ISOSAGDAILY' => 'ISOPROG/WFL/BATCH/ISOSAGDAILY' ); $bkuplive_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $bkuplive_wfls = array('no_job' => '------- select a job -------', 'BL/WFL/ONLINE/DUMP/BLDB' => 'BL/WFL/ONLINE/DUMP/BLDB', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', '$UTIL/O/AUDIT/CLOSE/BLDB' => '$UTIL/O/AUDIT/CLOSE/BLDB', 'DATARDWH/EXTRACTALL/DAILY/REIN/WFL' => 'DATARDWH/EXTRACTALL/DAILY/REIN/WFL', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', 'BL/WFL/FICHE/DISK' => 'BL/WFL/FICHE/DISK' ); $testsite_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $testsite_wfls = array('no_job' => '------- select a job -------', 'WFL/TESTLYON/DATABASE/ONLINE/DISABLE' => 'WFL/TESTLYON/DATABASE/ONLINE/DISABLE', 'UTIL/WFL/REMOVE/TESTLYON/BDFILES' => 'UTIL/WFL/REMOVE/TESTLYON/BDFILES', 'BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => 'BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' ); ?> <form method="POST" name="shiftreport" action="<?php print $_SERVER['PHP_SELF']; ?>"> <p>1st Shift <?php input_radiocheck('radio','shift','0','1','1'); ?></p> <p>2st Shift <?php input_radiocheck('radio','shift','0','2','1'); ?></p> <p>3st Shift <?php input_radiocheck('radio','shift','0','3','1'); ?></p> <table> <thead> <tr> <th>Application</th> <th>Job Stream</th> <th>Status</th> </tr> </thead> <tbody> <tr> <td>ARTISAN</td> <td> <?php input_select('artprogs',$artprog_wfls['no_job'], $GLOBALS['artprog_wfls'], '390px'); ?> </td> <td> <?php input_select('artprog_stat', $artprog_status['none'] , $GLOBALS['artprog_status']); ?> </td> </tr> <tr> <td>SELF INSURED</td> <td> <?php input_select('bllyprogs',$bllyprog_wfls['no_job'], $GLOBALS['bllyprog_wfls'], '390px'); ?> </td> <td> <?php input_select('bllyprog_stat', $bllyprog_status['none'] , $GLOBALS['bllyprog_status']); ?> </td> </tr> <tr> <td>SBWC</td> <td> <?php input_select('sbwcprogs',$sbwcprog_wfls['no_job'],$GLOBALS['sbwcprog_wfls'], '390px'); ?> </td> <td> <?php input_select('sbwcprog_stat', $sbwcprog_status['none'] , $GLOBALS['sbwcprog_status']); ?> </td> </tr> <tr> <td>TCS</td> <td> <?php input_select('tcsprogs',$tcsprog_wfls['no_job'], $GLOBALS['tcsprog_wfls'], '390px'); ?> </td> <td> <?php input_select('tcsprog_stat', $tcsprog_status['none'] , $GLOBALS['tcsprog_status']); ?> </td> </tr> <tr> <td>IC</td> <td> <?php input_select('icprogs',$icprog_wfls['no_job'], $GLOBALS['icprog_wfls'], '390px'); ?> </td> <td> <?php input_select('icprog_stat', $icprog_status['none'] , $GLOBALS['icprog_status']); ?> </td> </tr> <tr> <td>TRUCKING</td> <td> <?php input_select('truckprogs',$truckprog_wfls['no_job'], $GLOBALS['truckprog_wfls'], '390px'); ?> </td> <td> <?php input_select('truckprog_stat', $truckprog_status['none'] , $GLOBALS['truckprog_status']); ?> </td> </tr> <tr> <td>SMALL FLEET</td> <td> <?php input_select('smallprogs',$smallprog_wfls['no_job'], $GLOBALS['smallprog_wfls'], '390px'); ?> </td> <td> <?php input_select('smallprog_stat', $smallprog_status['none'] , $GLOBALS['smallprog_status']); ?> </td> </tr> <tr> <td>PERSONAL AUTO</td> <td> <?php input_select('persauto',$persauto_wfls['no_job'], $GLOBALS['persauto_wfls'], '390px'); ?> </td> <td> <?php input_select('persauto_stat', $persauto_status['none'] , $GLOBALS['persauto_status']); ?> </td> </tr> <tr> <td>ISO</td> <td> <?php input_select('isoprog',$isoprog_wfls['no_job'], $GLOBALS['isoprog_wfls'], '390px'); ?> </td> <td> <?php input_select('isoprog_stat', $isoprog_status['none'] , $GLOBALS['isoprog_status']); ?> </td> </tr> <tr> <td>BACKUPS LIVE</td> <td> <?php input_select('bkuplive',$bkuplive_wfls['no_job'], $GLOBALS['bkuplive_wfls'], '390px'); ?> </td> <td> <?php input_select('bkuplive_stat', $bkuplive_status['none'] , $GLOBALS['bkuplive_status']); ?> </td> </tr> <tr> <td>TEST SITE INSTRUCTIONS</td> <td> <?php input_select('testsite',$testsite_wfls['no_job'], $GLOBALS['testsite_wfls'], '390px'); ?> </td> <td> <?php input_select('testsite_stat', $testsite_status['none'] , $GLOBALS['testsite_status']); ?> </td> </tr> </tbody> </table> </form> </body> </html> The included functions file that I didn't include is below: Code: <?php function input_text($element_name, $value) { print '<input type="text" name="' . $element_name . '" value="'; print htmlentities($values[$element_name]) . '">'; } function input_submit($element_name,$label) { print '<input type="submit" name="' . $element_name .'" value="'; print htmlentities($label) .'"/>'; } function input_textarea($element_name,$values) { print '<textarea name="' . $element_name . '">'; print htmlentities($values[$element_name]) . '</textarea>'; } function input_radiocheck($type,$element_name,$values,$element_value,$clicker = '0') { print '<input type="' . $type . '" name="' . $element_name . '" value="' . $element_value . '" '; if ($element_value == $values[$element_name]) { print ' checked="checked"'; } if ($clicker == '1') print ' onclick="setReadOnly(this)"'; print '/>'; } function input_select($element_name, $selected, $options, $drop_width = '100px', $multiple = false) { print '<select style="width:' . $drop_width . ';" name="' . $element_name; if ($multiple) { print '[]" multiple="multiple'; } print '">'; $selected_options = array(); if ($multiple) { foreach ($selected[$element_name] as $val) { $selected_options[$val] = true; } } else { $selected_options[ $selected[$element_name] ] = true; } foreach ($options as $option => $label) { print '<option value="' . htmlentities($option) . '"'; if (isset($selected_options[$option])) { print ' selected="selected"'; } print '>' . htmlentities($label) . '</option>'; } print '</select>'; } ?> Hello, I am trying to implement a radio button option so that users can search specific sites such as google, yahoo, or bing from input box. Here's my code. Please help. <script type="text/javascript"> <!-- function goSearch(){ //search according to checked radio button } --> </script> <h1>Search Option</h1><br /> <input type="radio" name="search" id="google"/><a href="http://www.google.com" rel="nofollow" target="_blank"><img src="images/google.jpg" /></a> <input type="radio" name="search" id="yahoo"/><a href="http://www.yahoo.com" rel="nofollow" target="_blank"><img src="images/yahoo.jpg" /> </a> <input type="radio" name="search" id="bing" /><a href="http://www.bing.com" rel="nofollow" target="_blank"><img src="images/bing.jpg" /> </a> <br /><br /> <form method="get" action="goSearch()" rel="nofollow" target="_blank"> <div style="border:1px solid black;padding:4px;width:20em;"> <table border="0" cellpadding="0"> <tr> <td> <input type="text" name="q" size="25" maxlength="255" value="" /> <input type="submit" value="Search" /> </td> </tr> </table> </div> </form> I'm trying to make radiobuttons with a javascript function that gets called when a button is selected to make an image appear depending on what they click. However, after looking it up for a while I have nothing since some tell me to do document.formName.name.value; some tell me to use an id with my buttons and just use a document.getElementByID(""); etc. This is for a project and we havent used parameters yet and I dont know how to implement them in the HTML as well This is my code: function classchoice() { if(document.getElementById('mage') == true) { classtype = "<img class='display' src='mage.jpg'>"; document.getElementById("picture").innerHTML=classtype; } if(document.classes.classes.paladin == true) { classtype = "<img class='display' src='paladin.jpg'>"; document.getElementById("picture").innerHTML=classtype; } if(document.classes.classes.hunter == true) { classtype = "<img class='display' src='hunter.jpg'>"; document.getElementById("picture").innerHTML=classtype; } if(document.classes.classes.rogue == true) { classtype = "<img class='display' src='rogue.jpg'>"; document.getElementById("picture").innerHTML=classtype; } } This is the HTML: <form name="classes"> <input type="radio" name = "classes" id="mage" onmousedown="classChoice();"> <img src = "mage.jpg" /> <input type="radio" name = "classes" id = "Paladin" onmousedown="classChoice();"> <img src = "Paladin.png" /> <input type="radio" name = "classes" id = "hunter" onmousedown="classChoice();"> <img src = "hunter.PNG" /> <input type="radio" name = "classes" id = "rogue" onmousedown="classChoice();"> <img src = "rogue.jpg" /> </form> I hope it's readable because I copy and pasted my code and the indentations are a bit messed up I want to change radio button values dependent on the selected item in a drop down list. The radio buttons have default values but I need them to be changed when the selection has been made in the drop down list and before the submit button has been pressed so the changed values will be written to the database. Example : Drop down item : National Radio 1 value : Director Radio 2 value : National PA Drop down item : Regional Radio 1 value : Regional Manager Radio 2 value : Regional PA Drop down item : Local Radio 1 value : Store Manager Radio 2 value : Assistant Store Manager Any help will be appreciated. I have 4 rows in a table. Each row consist of 4 radio buttons. Each radio button per row has different values in it but has the same name (group) ex: <input type="radio" name="a" value="1"> <input type="radio" name="a" value="2"> <input type="radio" name="a" value="3"> <input type="radio" name="a" value="4"> <input type="radio" name="b" value="1"> <input type="radio" name="b" value="2"> <input type="radio" name="b" value="3"> <input type="radio" name="b" value="4"> and so on.. If I click radio button A with value 2, I want to output the total at the bottom as "2".. Also, if I click radio button B with value 3, I want to output the total of A and B as 5 and so on.. How can I automatically calculate the answer based on which radio button was click? update: I got my answer from this site: http://stackoverflow.com/questions/1...s-using-jquery I am trying to understand a button that calls a script without any onclick event, post or similar. I do not have a clue ... This is the code of the button Code: <div class="sNR"> <button type="button" class="sLR" id="gwt-debug-searchPanel-searchButton">Suchen</button> </div> From: Code: https://adwords.google.com/o/Targeting/Explorer?__u=1000000000&__c=1000000000&ideaRequestType=KEYWORD_IDEAS#search.none Is there any software that help would help me? PS: You need firebug or an equivalent to view the code. I need to make a table fadeout with JavaScript when I click a button. The table is simple. Code: <table id="users_table" style="border:1px solid #000;border-collapse: collapse;" border='1'> <tr class="dataRow"> <td>11</td> <td>12</td> <td>13</td> </tr> <tr class="dataRow"> <td>21</td> <td>22</td> <td>23</td> </tr> <tr id="row3" class="dataRow"> <td>31</td> <td>32</td> <td>33</td> </tr> <tr class="dataRow"> <td>41</td> <td>42</td> <td>43</td> </tr> </table> There is a button that calls a function called fadeout(). I cannot find a way to make the table fade out with just that one function. Is that even possible? If not, what other functions are necessary to make this happen? Hello All. What my script does is if you do not select a radio button and you hit submit an error will pop up saying please select game1. this is taken from the name of the radio button.. How can i make it so it prints out the VALUES of the 2 radio buttons. end result should print please select Baltimore Ravens vs. Cincinnati Bengals rather than please select game1. Code: function isChecked(radgrp) { var i = radgrp.length; do if (radgrp[--i].checked) return true; while (i); return false; } function validateTest(els) { var focus_me = null, msg = ""; if (!isChecked(els.game1)) { msg += " Game #1\n"; focus_me = focus_me || els.game1[0]; } if (!isChecked(els.game2)) { msg += " Game #2\n"; focus_me = focus_me || els.game2[0]; } if (!isChecked(els.game16)) { msg += " Game #16\n"; focus_me = focus_me || els.game16[0]; } if (msg != "") { var prefix = "\n WARNING: The following Games(s) were not selected:\n\n"; var suffix = "\nClick OK to submit your picks anyway.\n\n"; var suffix = suffix + "\n Click CANCEL to correct your picks." var ask = confirm(prefix + msg + suffix); if (ask) { if (focus_me) focus_me.focus(); return true; } else{ return false; } } } Here is the radio button. If you dont select the radio button i want the javascript validation pop but to say "please select Baltimore Ravens vs. Cincinnati Bengals rather than game1 like it does now. Code: <INPUT TYPE=RADIO NAME="game1" VALUE="Baltimore Ravens">Baltimore Ravens<BR> <INPUT TYPE=RADIO NAME="game1" VALUE="Cincinnati Bengals">Cincinnati Bengals<BR> Thanks Code: Quote: Code: Quote: Code: Quote: can somebody please tell me what need done. Everything is working fine except for the button created in javascript that is in the second window which is to open the third window. Thanks. Here's my HTML: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>The Happy Hoppin' Hotel</title> <script src="happyhoppin.js" language="javascript" type="text/javascript"></script> </head> <body> <h1>The Happy Hoppin' Hotel Checkout Page</h1> <h2>Fill out the form below to calculate balance due</h2> <form> Guest ID Number: <input type="text" id="guestID" /> <br /> <br /> Room Type: <select id="roomType"> <option></option> <option>Parlor</option> <option>Single</option> <option>Double</option> </select> <br /> <br /> Length of Stay: <input type="text" id="stayLength" /> <br /> <br /> Number of Drinks: <input type="text" id="drinkNumber" /> <br /> <br /> Number of Towels: <input type="text" id="towelNumber" /> <br /> <br /> Number of Flushes: <input type="text" id="flushNumber" /> <br /> <br /> Bug Complaints?: <br /> <form name="bugComplaintRadio"> <input type="radio" name="bugComplaint" value="No" />No</label> <br /> <input type="radio" name="bugComplaint" value="Yes" />Yes</label> <br /> </form> <br /> Customer Comments: <br /> <textarea name="customerComment" cols="50" rows="5">Enter your comments here...</textarea> <br /> <br /> <input type="button" onclick="calculateBill()" value="Calculate Bill"> </form> </body> </html> Here's my Javascript: Code: const parlorPrice = 80; const singlePrice = 100; const doublePrice = 150; const drinkPrice = 5; const towelPrice = 3; const flushPrice = 1; var guestID = 0; var roomPrice = 0; var stayLength = 0; var drinkNumber = 0; var towelNumber = 0; var flushNumber = 0; var totalDue = 0; var totalCharge = 0; function calculateBill(){ validateForm(); //roomType// if(roomType == "Parlor"){ roomPrice = parlorPrice; } if(roomType == "Single"){ roomPrice = singlePrice; } if(roomType == "Double"){ roomPrice = doublePrice; } //roomType// //drinkCharge// drinkCharge = drinkNumber * drinkPrice; //drinkCharge// //towelCharge// towelCharge = towelNumber * towelPrice; //towelCharge// //flushCharge// flushCharge = flushNumber * flushPrice; //flushCharge// //totalCharge// totalCharge = roomPrice + drinkCharge + towelCharge + flushCharge; //totalCharge// //**bugDiscount**// function getCheckedRadio() { bugValue = ""; bugLength = document.bugComplaintRadio.bugComplaint.length; var bugDiscount = 0; for (x = 0; x < bugLength; x ++) { if (document.bugComplaintRadio.bugComplaint[x].checked) { bugValue = document.bugComplaintRadio.bugComplaint[x].value; } } if (bugValue == "") { alert("You did not choose whether you had a bug complaint or not"); } if (bugValue = "No"){ bugDiscount = 0; } if (bugValue = "Yes"){ bugDiscount = 20; } } //**bugDiscount**// getCheckedRadio(); //totalDue// totalDue = totalCharge + bugDiscount //totalDue// displayBill(); } function validateForm(){ //guestID// guestID = parseInt(document.getElementById("guestID").value); if(isNaN(guestID)){ alert("Guest ID must be a number"); return; } if(guestID <= 0){ alert("Guest ID must be greater than zero"); return; } //guestID// //roomType// roomType = document.getElementById("roomType").value; if(roomType == ""){ alert("Room type must be selected"); return; } //roomType// //stayLength// stayLength = parseInt(document.getElementById("stayLength").value); if(isNaN(stayLength)){ alert("Length of stay must be a number"); return; } if(stayLength <= 0){ alert("Length of stay must be greater than zero"); return; } //stayLength// //drinkNumber// drinkNumber = parseInt(document.getElementById("drinkNumber").value); if(isNaN(drinkNumber)){ alert("Number of drinks must be a number"); return; } if(drinkNumber <= 0){ alert("Number of drinks must be greater than zero"); return; } if(drinkNumber > 25){ alert("Number of drinks has exceeded 25"); return; } //drinkNumber// //towelNumber// towelNumber = parseInt(document.getElementById("towelNumber").value); if(isNaN(towelNumber)){ alert("Number of towels must be a number"); return; } if(towelNumber <= 0){ alert("Number of towels must be greater than zero"); return; } //towelNumber// //flushNumber// flushNumber = parseInt(document.getElementById("flushNumber").value); if(isNaN(flushNumber)){ alert("Number of flushes must be a number"); return; } if(flushNumber <= 0){ alert("Number of flushes must be greater than zero"); return; } //flushNumber// //customerComment// customerComment = document.getElementById("customerComment"); //customerComment// } function displayBill(){ var newPage = "<html><head><title>Billing Summary</title></head>"; newPage += "<body><h1>Happy Hoppin Hotel</h1>"; newPage += "<h2>Guest Billing Statement</h2>"; newPage += "Guest Identification: #" + guestID; newPage += "<br />"; newPage += "Room Type: " + roomType; newPage += "<br />"; newPage += "Room Charge: $" + roomPrice; newPage += "<br />"; newPage += "Length of Stay: " + stayLength + " days"; newPage += "<br />"; newPage += "Drink Charge: $" + drinkCharge; newPage += "<br />"; newPage += "Towel Charge: $" + towelCharge; newPage += "<br />"; newPage += "Flushing Charge: $" + flushCharge; newPage += "<br />"; newPage += "Total Charge: $" + totalCharge; newPage += "<br />"; newPage += "Discount: $" + bugDiscount; newPage += "<br />"; newPage += "Total Due: $" + totalDue; newPage += "<br />"; newPage += "<h3>Come back and visit us again at the Happy Hoppin' Hotel!</h3>"; var z = window.open("","","width=400,height=500"); z.document.write(newPage); z.document.close(); } My question is, I've been spending countless hours trying to: 1. Make two radio buttons indicating "No" and "Yes", 2. Retrieve which selection the user has made, 3. Change the value of "bugDiscount" or the amount of money ($20 or $0) depending on which choice the user made; $0 for No & $20 for Yes. 4. Subtract the value of bugDiscount (0 or 20) from the totalCharge to get TotalDue I know I'm close, but I've tried any number of variations in my code and I still can't seem to get it right. Can anyone help? Hi, I have a choice of three market items and I want the value of the selected one to be sent to my form. My code is: Code: <script type="text/javascript"> function loadXMLDoc2(File,ID,Msg){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { try{ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } var params=Msg; xmlhttp.open("POST",File,true); xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache"); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.setRequestHeader("Content-length", params.length); xmlhttp.setRequestHeader("Connection", "close"); xmlhttp.send(params); } </script> </head> <body> <input type="radio" name="myitem" id="myitem" value="All;" onclick="OtherFunction()" />All <br /><br />' <input type="radio" name="myitem" id="myitem" value="Shirts" onclick="OtherFunction()" />Shirts <br /><br /> <input type="radio" name="myitem" id="myitem" value="Trousers" onclick="OtherFunction()" />Trousers <br /><br /> <br /><br /> <input type="button" class="indent" name="submitB" id="submitB" value="Submit" onclick="loadXMLDoc2('insertMarket.php','txtHint', 'md='+encodeURI(document.getElementById('myitem').value))" /> <div id="txtHint"></div> This doesn't work. I have tried giving them different ids, I have tried replacing the id with checked="id=\'myitem\'", I have tried getElementById(\'myitem.checked\'), I have tried getElementbyName. In my full page I have far more radio buttons, so I don't want to do a getElementById(\'myitem[0].checked || myitem[1].checked etc. I think the solution must be along these lines. But I have run out of alternatives to try. Needless to say as it currently stands it gives the last radio button's value, which means it doesn't like them having the same id, but when I tried changing how the id was applied, or called - ElementByName, FF gives the error message as id is null. Dear All, I am trying to design a from with radio buttons and text boxes which will accept text values upon clicking the radio buttons. So basically the textbox only appears when the radio button is clicked. The problem I am facing is the textbox does not hide upon selecting different radio button. Below I am posting the javascript and the associated html form for the same. I would like to request some suggestions and directions for the same. Regards Code: Javascript: <script type="text/javascript"> function show() { var i = 0; var el; while(el = document.getElementsByName('radio')[i++] ) { (document.getElementById('radio'+i).checked) ? document.getElementById('text'+i).style.display="block" : document.getElementById('text'+i).style.display="none" } } </script> Code: <div id="SeqInput"> <form method="post" action="the url to process this form" > <div> <label><input type="radio" name="seqinput" value="accession" id="radio1" onclick="show()"></label> NCBI accession number: <label for="accession"><input type="text" id="text1"></label><br> <label><input type="radio" name="seqinput" value="gene" id="radio2" onclick="show()"></label> NCBI Gene Name: <label for="gene"> <input type="text" id="text2"></label><br> <label><input type="radio" name="seqinput" value="file" id="radio3"></label> Upload fasta sequence from file: <label for="file"><input type="file" id="file"></label><br> <label><input type="radio" name="seqinput" value="fasta" id="radio4" onclick="show()"></label> Click to type in or copy/paste the fasta sequence:<br> <label><textarea rows="10" cols="100" id="text3" style="display: none"> </textarea></label> </div> </form> </div> I am using ASP validators and I have a contact form. I want to be able to have a phone and email radio button group. The email textbox also has a RegularExpressionValidator If the phone item is selected then I want the validation to be enabled on the phone text box making it mandatory while the email text box isn't, and if they choose the email as the contact it will be reversed. I want to be able to do this without having to do a postback. I already have the logic on the code behind and the enquiry object. also I am fairly new to javascript so I have been using mostly jQuery as easier to implement Hi all, I have a problem in javascript , ajax and jsp. Please see this url http://xil.co.in/print_screen_2.JPG. I am working on this form. There are sum buttons (like submit , add ,edit at bottom of this page , but not visible in printscreen). On click of a radio button on left side , form fields on right side and small table on right bottom is gettig populated. The table on right bottom , is actually the eligibility criteria associated with the record whose radio was clicked on left . On clicking radio of this record(right side) , I want to populate its values in the above text boxes present right in front of text "Eligibility". During the whole click process (clicking the left and right radio button ) page should not get refreshed. I am able to show records on left side by iterating over a resultset (in jsp) and able to populate field on right side also, but have no idea how to populate table on right bottom dynamically such that I can handle onclick event on its radio button. Pls tell me how to achieve this. Thanks in advance for any help. Hi, I have 4 radio buttons with separate div(s) I need to click on each radio button to show particular div(s) but I am not getting correct result Lease help HTML Code ---------- <input type="radio" name="list_prefer_c" id="list_prefer_c" value="1" onClick=\"get_radio_value(1);\" > <input type="radio" name="list_prefer_c" id="list_prefer_c" value="2" onClick=\"get_radio_value(2);\" > <input type="radio" name="list_prefer_c" id="list_prefer_c" value="3" onClick=\"get_radio_value(3);\" > <input type="radio" name="list_prefer_c" id="list_prefer_c" value="4" onClick=\"get_radio_value(4);\" > <div id="div1" style="display:none"> Facilities Management </div> <div id="div2" style="display:none"> <div style="font-weight:bold">Facilities Management, Contracting, MEP, Hydraulic Valves, trading etc… </div> <div id="div3" style="background-color:#00B0F0;display:none"> Facilities Management, Contracting, MEP, Hydraulic Valves, trading etc… </div> <div id="div4" style="background-color:#00B0F0;display:none"> Facilities Management,Contracting, MEP, Hydraulic Valves, Plumping, LV Switching, Fire alarm & Fire Fighting Trading etc… </div> JSCode -------- function toggleLayer(val) { if(val == 1) { document.getElementById('div1').style.display = 'block'; document.getElementById('div2').style.display = 'none'; document.getElementById('div3').style.display = 'none'; document.getElementById('div4').style.display = 'none'; } else if(val == 2) { document.getElementById('div1').style.display = 'none'; document.getElementById('div2').style.display = 'block'; document.getElementById('div3').style.display = 'none'; document.getElementById('div4').style.display = 'none'; } else if(val == 3) { document.getElementById('div1').style.display = 'none'; document.getElementById('div2').style.display = 'none'; document.getElementById('div3').style.display = 'block'; document.getElementById('div4').style.display = 'none'; } else if(val == 4) { document.getElementById('div1').style.display = 'none'; document.getElementById('div2').style.display = 'none'; document.getElementById('div3').style.display = 'none'; document.getElementById('div4').style.display = 'block'; } } All, I have the following code: Code: <form action="" name="myform" method="post"> <input type="hidden" id="picimages" name="picimages" value="<?php echo $resultsetstory['bigger_id']; ?>" /> <p> <label> <input type="radio" id="picimages" name="picimages" value="<?php echo $resultsetstory['picture_id']; ?>" /> <?php if($resultsetstory['title']<>""){ echo $resultsetstory['title']; }else{ echo "Image 1"; } ?> </label> <br /> <label> <input type="radio" id="picimages" name="picimages" value="<?php echo $resultsetpic2['picture_id']; ?>" /> <?php if($resultsetpic2['title']<>""){ echo $resultsetpic2['title']; }else{ echo "Image 2"; } ?> </label> <br /> <input name="submit" type="button" value="Vote!" onclick="javascript:voteupdate(this.myform);"/> </p> </form> When I submit this, it goes to this function: Code: function voteupdate(obj) { var poststr = "picimage=" + document.getElementById("picimage").value + "&bigger_id=" + encodeURI( document.getElementById("bigger_id").value ); alert(poststr); makePOSTRequest('voteresults.php', poststr); } However I can't get the value of the radio group for the one that is selected. Can someone see what is wrong? Thanks. |