|
JavaScript - Ddl Element Based On Radio Button Group
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 Similar TutorialsIf I have a radio button group called "RADIO1" how can I put focus on there? Is it like this? document.theForm.RADIO1[0].focus; 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 would like to display one of two different <div> tags based on a radio button. In essence, this would be the "basic" and "advanced" options as the user end. Can this be done easily or will it be complex? I am a complete JS noob. I have been googling for hours trying to find a way to implement what I think is a simple thing - but alas my deadline is here, and I need to solve this and seek guidance from courteous experts! In a nutshell I have a simple form that has radio buttons: Code: <p><input id="amount" name="amount" type="radio" value="125" />$125</p> <p><input id="amount" name="amount" type="radio" value="75" />$75</p> <p><input id="amount" name="amount" type="radio" value="50" />$50</p> <p><input id="amount" name="amount" type="radio" value="25" />$25</p> <p><input id="amount" name="amount" type="radio" value="other" /><input id="other_amount" name="other_amount" type="text" maxlength="7" style="width:100px;" /> Other ($10 minimum donation)</p> The point of the form is to assign the value to "amount" for sending on to a paypal form. The problem is, I need the value of "amount" to change (be assigned) if they chose "other". To take the value from the text input box "other_amount" and assign it to "amount" but only if they chose the 5th radio button. I have some JS that I hacked together that checks to see if they chose the 5th radio button. attempts to assign the "other amount" to "amount" and then pops up an alert (only so I know the script is pushing the right value - wont be needed when complete.) However, Even though the alert pops up with the proper "other_amount" as if it has been assigned properly, the data is not sent on properly I presume, as it is the only aspect of the paypal donation amount form that is not working or providing the next page with the right "amount" pre-determined. Code: <script type="text/javascript">
<!--
function get_radio_value()
{
if (document.donation.amount[4].checked)
{
document.getElementById('amount').value = document.donation.other_amount.value;
alert(document.getElementById('amount').value);
}
}
//-->
</script>
Help please! Many thanks in advance! Deadline agh! form is .asp scenario: I have 3 radio buttons above number of boxes (dropdown). I want the dropdown selection box greyed out on selecting Electronic (radio button) Physical (radio button) Image (radio button) Electronic (radio button) Number of Boxes [dropdown box] Thanks for your help I am new to coding. Hi Guys, I'm fairly new to Javascript and would be grateful for any help you can give me. I've had a search on Google and found a couple of potential solutions but nothing seems to work quite right for what I need. Basically I have a form with several questions followed by Yes/No radio buttons. Dependent on which answer is given, I want to display a different message above the text box. For example, if you answered 'no' to a certain question then the message above the text box would change to say "Please fill in additional information" or something along those lines. Below is the HTML to give you an idea of what I mean. Code: <table> <tr> <td> </td> <td><label class="bold">Yes</label></td> <td><label class="bold">No</label></td> </tr> <tr> <td><label for="property_q1"> - Is this your house?</label></td> <td><input name="property_q1" id="property_q1" type="radio" value="Yes" /></td> <td><input name="property_q1" id="property_q1" type="radio" value="No" /></td> </tr> </table> <br /> <div id="fine">It's fine, don't worry about filling it in.</div> <div id="fill" style="display:none">Please fill in the form below.</div> <table> <tr> <td> </td> </tr> <tr> <td><textarea name="info" id="info" cols="60" rows="5"></textarea></td> </tr> </table> <input type="submit" /> 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>';
}
?>
I have a radio button that asks Does your URL exist or need to be purchased? and a drop down menu that lists different types of web projects (i.e. new website and website redesign). What I'm trying to achieve is, if the user selects that the URL exists, I would like the drop down menu option new website to be removed from the list. Form: Code: <form> <input type="radio" name="website_status" value="exists"/> Exists <input type="radio" name="website_status" value="purchase_required"/> Needs to be purchased <select name="projects"> <option></option> <option value="new_website">New Website</option> <option value="website_redesign">Website Redesign</option> </select> </form> JavaScript: [CODE] <script> window.onload = initForms; function initForms() { for (var i=0; i<document.forms.length; i++) { document.forms[i].onsubmit = function() {return validForm();} } } function validForm() { var inputarray = document.getElementsByTagName("input"); var selectarray = document.getElementsByTagName("select"); var textarea = document.getElementsByTagName("textarea"); if (inputarray[0].checked == true) { selectarray[0].remove(options[1]); return false; } </script> I've been experimenting with this for the last couple hours and am getting nothing! Could someone please point me in the right direction? I am very inexperienced with javasciprt. I am designing a form in coldfusion, and want some dynamic action to take place. My users will be offered 2 selections via radio buttons. Depending on which radio button they select, they will get a few more radio buttons to choose from. I have been told that this can be handled in javascript. So I am appealing to the javascript programmer nation for some assistance in this endeavor. Any help would be greatly appreciated, Thanks. I have garlic.js automatically local storing my radio button value but the onclick function does not run when the page reloads. Is there a way to work around this ??
Reply With Quote 01-15-2015, 11:17 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts And we are supposed to guess what "garlic.js" is doing? Or what it is? And do you really mean that the onclick event handler does not work? Or do you mean that the radio buttons are set to a different state but the click() for the chosen button is not executed? That is, it is not the onclick that is missing, it is the click ?? Codes for Dropdown menu based on radio buttons selection needed!? I need urgent help with this: I need codes for a dropdown menu that is altered by radio buttons. I want to insert the value selected from the dropdown menu into a table. All: I need some help with a radio button code. It seems simple but I am really new at JavaScript so I need help. I have created a JavaScript code that has three radio buttons (High, Medium, and Low). When you click on high two text boxes appear so that an email address can be added. What I need help with is making the text boxes disappear if someone accidentally click high and then went back to low or medium. Currently the High button stays clicked and the text boxes still show. Any help would be great. Thanks, Stephen Code: <script type="text/javascript">
function showHide(el){
obj = document.getElementById(el).style;
(obj.display == 'none')? obj.display = 'block' : obj.display = 'none';
}
</script>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="Checkbox" name="High" value="High" onclick="showHide('group1')" /> High
</label>
<label>
<input type="Checkbox" name="Medium" value="Button" /> Mediun
</label>
<label>
<input type="Checkbox" name="Medium" value="Button" /> Low
</label>
<p id="group1" style="display: none;">
<label>
<b>friend1  </b><input type="Text" name="textGroup1" value="@gmail.com" /> <br/>
</label>
<br />
<label>
<b>friend2  </b><input type="text" name="textGroup1" value="@gmail.com" />
</label>
</p>
</form>
I don't exactly know how to word my issue. Basically, I need it so that if a user selects 'option1' in the group 'group1' when they go to 'group2' is only gives them a certain selection to choose from. If they choose 'option2' in 'group1' they will get a different set to choose from. My main dilemma is it must do this without them having to submit. 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. Hello All, I am fairly new to javascript. I need to access a button on a form and perform task using onclick. When I view the source of the page, the id of the button seems to be dynamic with a 'Link' suffix. (ex. xtydLink). How can I access this button if I cannot use getelementbyid because the ID changes? Thanks in advance I using the following to read the content of a text field but how do I read the content of a radio button ? Code: String.prototype.trim = function () { //return this.replace(/^\s*/, "").replace(/\s*$/, "");
return this.replace(/^\s+|\s+$/g, '').replace(/\s+/g,' ');
}
var fID = document.getElementById('customerName'); fID.value = fID.value.trim();
if (fID.value.trim().split(' ').length < 2) {
document.getElementById('customerNameImg').innerHTML = redX;//
} else {
document.getElementById('customerNameImg').innerHTML = greenTick;//
}
this is the part of my form code that i am having problems with Code: <ul>
<li class="<? if ($empty_Field == "previousClient") {?>emptyfield<? } else { ?>field<? } ?>"> Are you a Previous Client * </li>
<li class="value">
<div style="float: left;"><input type="radio" name="previousClient" id="previousClientY" value="Yes" <? if($previousClient == 'Yes') { echo 'checked'; } ?> onChange="checkValidFormInput();"> Yes
</div>
<div style="float: left; padding-left: 20px;">
<input type="radio" name="previousClient" id="previousClientN" value="No" <? if($previousClient == 'No') { echo 'checked'; } ?> onChange="checkValidFormInput();"> No
</div>
<div style="float: left; padding-left: 10px;" id="previousClientImg"></div><br style="clear:both">
</li>
</ul>
How can I style the background of a radio button? I have a form where it validates the users has selected one of the radio group values. If they don't the group gets focus and I would like to highlight the radio group. I tried the below it it seems focus goes to the correct group but no background changes. Now I know you can change the background of radios and apply a border of you would like. What am I doing wrong woth this. Code: <script type="text/javascript">
function validate(){
document.forms[0].myradio[0].checked = true
document.forms[0].myradio[0].style.border='2px dotted #00f';
document.forms[0].myradio[0].style.backgroundColor='#ffff99';
}
</script>
<form name="test" name="theForm" onsubmit="validate()">
<input type="radio" name="myradio" />
<input type="radio" name="myradio" />
<input type="radio" name="myradio" />
<BR>
<BR>
<BR>
<BR>
<input type="radio" name="myradio2" />
<input type="radio" name="myradio2" />
<input type="radio" name="myradio2" />
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<input type="radio" name="myradio3" />
<input type="radio" name="myradio3" />
<input type="radio" name="myradio3" />
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<input type="radio" name="myradio4" />
<input type="radio" name="myradio4" />
<input type="radio" name="myradio4" />
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<input type="radio" name="myradio5" />
<input type="radio" name="myradio5" />
<input type="radio" name="myradio5" />
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<input type="radio" name="myradio6" />
<input type="radio" name="myradio6" />
<input type="radio" name="myradio6" />
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<input type="submit" value="submit" name="submit">
</form>
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 guys...I am new to javascript.....I need help with my code below.I need to change it to " the font size of a paragraph should only be changed if the "Magnified" button is selected AND the mouse cursor is over a paragraph. When the mouse moves over a paragraph, increase the font size by a factor of 3. When it is no longer over the paragraph, reduce the font back to its original size" HELP and thanks.... <html> <head> <title>Assignment 4</title> </head> <body> <p> <script launguage="javascript"> var fontSize = 1; function zoomIn() { fontSize += 0.1; document.body.style.fontSize = fontSize + "em"; } function zoomOut() { fontSize -= 0.1; document.body.style.fontSize = fontSize + "em"; } </script> </p> <h2>Joseph’s text zoom and radio buttons</h2> <p>Click on below buttons and see the text getting zoomed in and out..!!</p> <input type="radio" name="radio" value="fontSize -" onclick = "zoomOut()"/> <label for="original">Standard</label> <br><br> <input type="radio" name="radio" value="fontSize -" onclick = "zoomIn()"/> <label for="zoomed">Magnified</label> </body> </html> I'm trying to get the value of a radio button when clicked. I'm dynamically creating these radio buttons while populating a table like this: Code: var rad
for(blah blah blah){
insert array data into table...
insert array data into table...
insert array data into table...
rad = document.createElement('input');
rad.setAttribute('type', 'radio');
rad.setAttribute('name', 'options');
rad.setAttribute('value', id);
rad.onclick = function() { doSomething() };
cell.appendChild(rad);
}
If I'm in the doSomething function, how do I access the value or ID of the radio button? Thanks! |
|||||||