|
JavaScript - How To Post Hidden Values With Multiple Options Selected
Similar TutorialsI've inherited this piece and now I'm suppose to add to it. Its basic function currently is when the "Other" option is selected, a hidden text field shows. Now, I need to add when "Athletics" is selected, another hidden select group will show. I've set up the new Select group already, but not sure how to incorporate it into the already existing script. I've been researching for two days, and hopefully this form will be helpful. Code: <select id="Program" name="Program" size="1" onchange="
$other = document.getElementById('other_program').style;
$invoice = document.getElementById('invoice');
if (selectedIndex==6) {
$other.visibility='visible';
if ($invoice.value == 'General Fund') $invoice.value='';
} else {
$other.visibility='hidden';
if (selectedIndex==1) {
$invoice.value='Renegade Fund';
} else {
$invoice.value='Please Specify';
}
}
">
<option selected="selected" value="Not Selected"> - - Select One - - </option>
<option value="Athletics">Athletics</option>
<option value="Drum Line">Drum Line</option>
<option value="Renegade Fund">Renegade Fund</option>
<option value="General Scholarships">General Scholarships</option>
<option value="President's Circle">President's Circle</option>
<option value="Other">Other</option>
</select>
<span id="other_program"><input type="text" id="invoice" name="invoice" size="15" /></span>
<!-- the following is the new select group ive set up
<span id="alumni">
<select id="select-alumni" name="select-alumni" size="1">
<option selected="selected" value="Not Selected">Yes or No</option>
<option value="Yes-alumni">Yes</option>
<option value="Not-alumni">No</option>
</select>
</span>
-->
Hello, I am hoping someone can help me with following search form. As you can see I have created a form but I don't know how to fix the coding so when a user select a category it will add a different hidden filed for that option for example: When the user selects category "Men" the hidden filed Code: <INPUT TYPE="HIDDEN" NAME="REFERRER" VALUE="http://men.com/acatalog/"> will be added and when the user selects category "Kids" the hidden filed Code: <INPUT TYPE="HIDDEN" NAME="REFERRER" VALUE="http://kids.com/acatalog/"> will be added and so on... Here is my form coding I am using: Code: <form name="simplesearch" method="get" action="" onsubmit="ssite=document.getElementById('sitelist');this.action=ssite.options[ssite.selectedIndex].value;return true;">
<input type="hidden" name="page" value="search" />
<input type="hidden" name="PR" value="-1" />
<input type="hidden" name="TB" value="A" />
<input type="hidden" name="NOLOGIN" value="1" /><input align="top" class="main_search_box" name="SS" type="text" value="search for ..." onfocus="this.value='';">
Search within:
<select id="sitelist">
<option value="">Select Catagory</option>
<option value="http://kids.com/cgi-bin/ss000001.pl">kids</option>
<option value="http://men.com/cgi-bin/ss000001.pl">men</option>
<option value="http://women.com/cgi-bin/ss000001.pl">women</option>
</select><input type="submit" class="button" name="ACTION" value="Go!">
</form>
Also I have one more question how do I make the "Select Catagory" a Must Choose and if not chosen to give message that say"Please Select a Category" Thank you in advance for any help you can give me... I am a bigginer so please go easy on me Hi, Is there anyone who could help me figure out how to Change a Hidden Fields Name based on selected option. The hidden fields name is sent off and I need to change the name depending on what option they select. For if they select MyList the hidden field name needs to be SelectLists[40] or if they select testlist the hidden field name needs to be SelectLists[41]. This is probably way, way off but I've done this and it doesn't work. Any help would be greatly appreciated, thanks. <script language="JavaScript"> function changelist() { //here we assign the value of the hidden input to x x=eval(document.getElementByName("SelectLists[40]"); if(document.getElementById("SelectLists[40]").selected=true x=SelectLists[40] else(document.getElementById("SelectLists[41]").selected=true x=SelectLists[41] else(document.getElementById("SelectLists[42]").selected=true x=SelectLists[42] //now we assign the new value to the input document.getElementById("theHiddenInput").name=x; //and now we test alert(document.getElementById("theHiddenInput").name) } </script> <input type="hidden" id="theHiddenInput" name="SelectLists[40]" value="Yes"> <select class="inpBox" style="width: 287px" name='mailinglist' id="lists" onchange="changelist()"> <option value="SelectLists[40]" name="SelectLists[40]" id="SelectLists[40]">MyList</option> <option value="SelectLists[41]" name="SelectLists[41]" id="SelectLists[41]">testlist</option> <option value="SelectLists[42]" name="SelectLists[42]" id="SelectLists[42]">testlist2</option> Hi all! I'm using a multiselect box on my website, similar to this one: <Select Name="multiselect[]" multiple="multiple"> <option>This is option 1</option> <option>This is option 2</option> <option>This is option 3</option> <option>This is option 4</option> </select> Now I want to set option 1, option 2 and option 3 as selected (highlighted) in javascript. How would I go about doing this? I tried something like this: document.taakform.elements['multiselect[]'].selectedIndex = "1" document.taakform.elements['multiselect[]'].selectedIndex = "2" document.taakform.elements['multiselect[]'].selectedIndex = "3" Of course this doesn't work (else I wouldn't be posting here ), but I hope you catch my drift. Thanks in advance guys (and gals)! Okay so I'm trying to come up with as many alternative methods to accomplish something. So I'm just seeking input from anyone who is willing to supply some. After the user clicks on a match type it'll know HOW MANY sides to the match there are so say for a singles match it'd have 2 sides (1 vs. 1) for a Triple Threat Match it'd have 3 sides (1 vs. 1 vs. 1) and so on. All matches have a stored field in the database of how many sides they have. So I'm thinking that I could have it create 3 divs (or something) down in the competitors area of how many sides there are in the match (separated by a VS. text block) and when the user selects a character from the dropdown and adds a character the user can maybe drag and drop the character's name to whatever side they choose. Its one idea. If you think of an EASIER more EFFICIENT way to do something like this and have an idea say something please or even if you can't let me know that you think it's a worth while idea. Code: <label for="matchtypedrop<?php echo $i+1 ?>">Match Type:</label>
<select class="dropdown" name="matchtypedrop<?php echo $i+1 ?>" id="matchtypedrop<?php echo $i+1 ?>" title="Match Type <?php echo $i+1 ?>">
<option value="0">- Select -</option>
<?php
$query = 'SELECT id, matchtype FROM matchtypes';
$result = mysqli_query ( $dbc, $query ); // Run The Query
while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) {
print "<option value=\"".$row['id']."\">".$row['matchtype']."</option>\r";
}
?>
</select>
<label for="competitors<?php echo $i+1 ?>">Competitors:</label><ul id="competitors<?php echo $i+1 ?>" style="list-style: none; margin-left: 195px;"></ul>
<select class="dropdown" name="charactersdrop<?php echo $i+1 ?>" id="charactersdrop<?php echo $i+1 ?>" title="Characters Dropdown <?php echo $i+1 ?>" style="margin-left: 195px;">
<option value="0">- Select -</option>
<?php
$query = 'SELECT id, `character` FROM characters ORDER BY `character`';
$result = mysqli_query ( $dbc, $query ); // Run The Query
while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) {
print "<option value=\"".$row['id']."\">".$row['character']."</option>\r";
}
?>
</select>
<input type="button" value="Add Character" class="" onclick="Competitors(<?php echo $i+1 ?>)"/>
I have two select lists. Morning Code: <tr valign="top">
<td align="right">Morning:</td>
<td><select name="wcsave_09_msession" id="wcsave_09_msession" size="1" onblur="CheckField(this.form,this,'');" onchange="display1(this,'Mastery sesson 1','Concurrent sessons 1-6');">
<option value="" selected="selected">Choose one</option>
<option value="Mastery sesson 1">Mastery sesson #1</option>
<option value="Concurrent sessons 1-6">Concurrent sessons #1-#6</option>
</select>
</td>
</tr>
Afternoon: Code: <tr valign="top">
<td align="right">Afternoon:</td>
<td><select name="wcsave_09_asession" id="wcsave_09_asession" size="1" onblur="CheckField(this.form,this,'');" onchange="display2(this,'Mastery sesson 2','Concurrent sessons 7-12');"><!--showDiv(this.value)-->
<option value="" selected="selected">Choose one</option>
<option value="Mastery sesson 2">Mastery sesson #2</option>
<option value="Concurrent sessons 7-12">Concurrent sessons #7-#12</option>
</select>
</td>
</tr>
In each list depending on what option is chosen, a corresponding div will show with select lists. Morning div: Code: <div id="Mastery sesson 1" style="display: none;">
<table class="special">
<tr valign="top">
<td>(9:15 a.m. - 10:15 a.m.)<br /><select name="wcsave_10_session_mmastery" id="wcsave_10_session_mmastery">
<option value="" selected="selected">Choose one</option>
<option value="Mastery session #1 - Computer Lab: Searching Essentials"><strong>Mastery session #1</strong> - Computer Lab: Searching Essentials</option>
</select>
</td>
</tr>
</table>
</div>
<div id="Concurrent sessons 1-6" style="display: none;">
<table class="special">
<tr valign="top">
<td>Choose a session for each time slot.<br />
(9:15 a.m. - 10:15 a.m.)<br /><select name="wcsave_10_session_mconc1" id="wcsave_10_session_mconc1" onchange="toggleSelect();">
<option value="" selected="selected">Choose one</option>
<option value="Concurrent session #1 - IRB 101 for Research Nurses">Concurrent session #1 - IRB 101 for Research Nurses</option>
<option value="Concurrent session #2 - A Research Poster Contest as a Tool to Learn About Research/EBP">Concurrent session #2 - A Research Poster Contest as a Tool to Learn About Research/EBP</option>
<option value="Concurrent session #3 - Beginning the EBP Journey: Evaluating and Synthesizing the Literature">Concurrent session #3 - Beginning the EBP Journey: Evaluating and Synthesizing the Literature</option>
</select>
</td>
</tr>
<tr valign="top">
<td>(10:30 a.m. - 11:30 a.m.)<br /><select name="wcsave_10_session_mconc2" id="wcsave_10_session_mconc2" onchange="toggleSelect();">
<option value="" selected="selected">Choose one</option>
<option value="Concurrent session #4 - IRB 101 for Research Nurses">Concurrent session #4 - Making Sense of Statistics When Reading Research</option>
<option value="Concurrent session #5 - Original Research Presentations">Concurrent session #5 - <em>Original Research Presentations</em></option>
<option value="Concurrent session #6 - IRB Considerations with Vulnerable Populations">Concurrent session #6 - IRB Considerations with Vulnerable Populations</option>
</select>
</td>
</tr>
</table>
</div>
Afternoon div: Code: <div id="Mastery sesson 2" style="display: none;">
<table class="special">
<tr valign="top">
<td>(1:45 p.m. - 4:00 p.m.)<br /><select name="wcsave_10_session_mmastery" id="wcsave_10_session_mmastery">
<option value="" selected="selected">Choose one</option>
<option value="Mastery session #2 - Beyond the Basics of Searching!"><strong>Mastery session #2</strong> - Beyond the Basics of Searching!</option>
</select>
</td>
</tr>
</table>
</div>
<div id="Concurrent sessons 7-12" class="hiddenDiv">
<table class="special">
<tr valign="top">
<td>Choose a session for each time slot.<br />
(1:45 p.m. - 4:00 p.m.)<br /><select name="wcsave_10_session_aconc1" id="wcsave_10_session_aconc1" onchange="toggleSelect();">
<option value="" selected="selected">Choose one</option>
<option value="" selected="selected">Choose one</option>
<option value="Concurrent session #7 - EBP Protocols">Concurrent session #7 - EBP Protocols</option>
<option value="Concurrent session #8 - Writing for Publication">Concurrent session #8 - Writing for Publication</option>
<option value="Concurrent session #9 - Original Research Presentations">Concurrent session #9 - Original Research Presentations</option>
</select>
</td>
</tr>
<tr valign="top">
<td>(3:00 p.m. - 4:00 p.m.)<br /><select name="wcsave_10_session_aconc2" id="wcsave_10_session_aconc2" onchange="toggleSelect();">
<option value="" selected="selected">Choose one</option>
<option value="Concurrent session #10 - Writing a Research Question Using PICO">Concurrent session #10 - Writing a Research Question Using PICO</option>
<option value="Concurrent session #11 - EBP Project Presentations">Concurrent session #11 - EBP Project Presentations</option>
<option value="Concurrent session #12 - The Role of the Research Facilitator">Concurrent session #12 - The Role of the Research Facilitators</option>
</select>
</td>
</tr>
</table>
</div>
Once two options are chosen in the divs, the Afternoon or Morning becomes disabled. Code: function toggleSelect() {
var selBox0 = document.getElementById('wcsave_10_session_mconc1');
var selBox1 = document.getElementById('wcsave_10_session_mconc2');
var selBox2 = document.getElementById('wcsave_09_msession');
var selBox3 = document.getElementById('wcsave_10_session_aconc1');
var selBox4 = document.getElementById('wcsave_10_session_aconc2');
var selBox5 = document.getElementById('wcsave_09_asession');
if ((selBox0.selectedIndex !=0) && (selBox1.selectedIndex !=0)) {selBox5.disabled = true;} else {selBox5.disabled = false;}
if ((selBox3.selectedIndex !=0) && (selBox4.selectedIndex !=0)) {selBox2.disabled = true;} else {selBox2.disabled = false;}
}
Here is the code to show/hide the divs: Code: function display1(obj,id1,id2) {
var selBox0 = document.getElementById('wcsave_10_session_mconc1');
var selBox1 = document.getElementById('wcsave_10_session_mconc2');
var selBox2 = document.getElementById('wcsave_09_msession');
var selBox3 = document.getElementById('wcsave_10_session_aconc1');
var selBox4 = document.getElementById('wcsave_10_session_aconc2');
var selBox5 = document.getElementById('wcsave_09_asession');
var txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
if ( txt.match(id1) ) {document.getElementById(id1).style.display = 'block';}
if ( txt.match(id2) ) {document.getElementById(id2).style.display = 'block';}
}
function display2(obj,id1,id2) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
if ( txt.match(id1) ) {document.getElementById(id1).style.display = 'block';}
if ( txt.match(id2) ) {document.getElementById(id2).style.display = 'block';}
}
What I want to do is set the sub div dropdown selectedIndex == 0 when Morning or Afternoon is set to Choose one. In essence clearing the values when the div is hidden so the other fields are no longer disabled. Any ideas? Hi All Not sure if this is the right place to post but could do with some help. Scenario: 1 Box holds 3 items, Complete box weighs 75g, each item 25g, customer chooses their own 3 combo items. This could be the same all the same item or 3 different items. I need a script that will require the selections to make up 75g in order to continue the process. i.e customer can only continue when 3 items / 75g worth are selected. Here is a short version, I have about 12 selectors at the moment and possible more will be created (if that matters). Code: <form name="cart_quantity" action="myProduct?action=add_product" method="post" enctype="multipart/form-data">
<
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-6">Hard Boiled 1</label><br />
<select name="id[6]" id="attrib-6">
<option value="">Select Portion</option>
<option value="24">25g</option>
<option value="25">50g</option>
<option value="26">75g</option>
</select>
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-7">Hard Boiled 2</label><br />
<select name="id[7]" id="attrib-7">
<option value="">Select Portion</option>
<option value="27">25g</option>
<option value="28">50g</option>
<option value="29">75g</option>
</select>
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-8">Hard Boiled 3</label><br />
<select name="id[8]" id="attrib-8">
<option value="">Select Portion</option>
<option value="30">25g</option>
<option value="31">50g</option>
<option value="32">75g</option>
</select>
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-9">Hard Boiled 4</label><br />
<select name="id[9]" id="attrib-9">
<option value="">Select Portion</option>
<option value="33">25g</option>
<option value="34">50g</option>
<option value="35">75g</option>
</select>
</form>
The section of the form is just the portion with selctors, there are other fields with radio buttons for color choice etc. I have searched for something like this all over but cant find it. Please please please could some genius out there help. Thanks in advance I am creating a recipe cookbook program. On the main page, I have a top frame (named "nav") and bottom frame (named "recipe_layout"). There is a listbox in the BOTTOM frame containing the recipe names, and a "View Recipe" button in the TOP frame. The user would select a recipe and then click the button to view the recipe in the bottom frame. I believe that I need to insert the code to make this work with the button (?), and I think my problem is that I'm not accessing the bottom frame correctly: CURRENT CODE FOR LISTBOX IN BOTTOM FRAME <form name="recipe_form" style="margin-top:30"> <select name="name_dropdown" multiple size="2"> <option selected="selected">Search byName</option> <option value="applepie.html">Apple Pie</option> CURRENT CODE FOR BUTTON IN TOP FRAME <input type="button" value="View Recipe" onclick="parent.recipe_layout.location.href='recipe_form.name_dropdown.options[selectedIndex].value'"> Thank you so much in advance!! Hello! coding forums pals, I am resorting to you for help with a html form that uses javascript to validate data. the form is an invoice for a trip order where the user can select a trip location out of a listbox, a number of people traveling, and where they wish to stay(ex. hotel, tent, etc.) after the user selects one for each category and hits the "add to invoice" button, the fields in the invoice should get filled with the corresponding information. Now my question is how can I write code that will insert information in the next row down after the previous row has been filled? basically what logic and programming structure do I need in my function that will know when the first row in the invoice is filled. I'm struggling at the part where when the "add to invoice" button is clicked. some data is added to the invoice, and if the user wants to book another trip, the second trip should be appended in the second row of the invoice. what is happening in mine is that whenever I book another trip, the first one gets overwritten when in fact it should be left intact and the data should get appended in the next row down. Code: <html>
<head>
</head>
<script type="text/javascript">
function addit()
{
var f = document.myform;
var cost = 0;
var percentage = 0;
if(f.destination.selectedIndex == -1)
{
alert("please select a trip from the list");
return false;
}
if((f.travelers[0].checked == false) && (f.travelers[1].checked == false) && (f.travelers[2].checked == false) && (f.travelers[3].checked == false) && (f.travelers[4].checked == false) && (f.travelers[5].checked == false))
{
alert("please specify the number of people traveling")
return false;
}
if(f.accomodation.selectedIndex == -1)
{
alert("please specify your place of stay")
return false;
}
switch(f.destination.selectedIndex)
{
case 0:
document.myform.trip1.value="Mt. Kilimanjaro";
cost="2600";
break;
case 1:
document.myform.trip1.value="Denali";
cost="2000";
break;
case 2:
document.myform.trip1.value="Mt. Everest";
cost="3500";
break;
case 3:
document.myform.trip1.value="Maui";
cost="2700";
break;
case 4:
document.myform.trip1.value="Machu-Pichu";
cost="3100";
break;
}
for(i=0;i<f.travelers.length;i++)
{
if(f.travelers[i].checked)
f.num1.value=f.travelers[i].value;
}
f.cost1.value=parseInt(f.num1.value) * parseInt(cost);
switch(document.myform.accomodation.selectedIndex)
{
case 0:
percentage="0.00";
break;
case 1:
percentage="0.05";
break;
case 2:
percentage="0.15";
break;
case 3:
percentage="0.22";
break;
}
f.accom1.value=f.cost1.value * parseFloat(percentage);
f.total1.value=parseInt(f.cost1.value) + parseInt(f.accom1.value);
}
function deleteit()
{
var f = document.myform;
var txtbox = document.getElementsByClassName("text");
var rad = document.getElementsByClassName("rad");
f.destination.selectedIndex=-1;
f.accomodation.selectedIndex=-1;
for(j=0;j<txtbox.length;j++)
{
txtbox[j].value="";
}
for(x=0;x<rad.length;x++)
{
rad[x].checked=false;
}
}
function submitform()
{
document.myform.submit();
}
</script>
<body>
<form name="myform">
<table align="center" border="1" bgcolor="skyblue" cellpadding="0" cellspacing="0">
<tr><th>Trips Available</th><th>Number</br> Traveling</th><th>Accomodation</br> Type</th><th>Invoice</th></tr>
<tr><td align="center"><select name="destination" id="Select1" size="4">
<option>Mt. Kilimanjaro</option>
<option>Denali</option>
<option>Mt. Everest</option>
<option>Maui</option>
<option>Machu-Pichu</option>
</select></td>
<td align="center">1<input type="radio" name="travelers" value="1" class="rad"></br>2<input type="radio" name="travelers" value="2" class="rad"/></br>3<input type="radio" name="travelers" value="3" class="rad"/></br>4<input type="radio" name="travelers" value="4" class="rad"/></br>5<input type="radio" name="travelers" value="5" class="rad"/></br>6<input type="radio" name="travelers" value="6" class="rad"/></td>
<td align="center">
<select name="accomodation" id="Select2" size="3">
<option value=0>Tents</option>
<option>Yurts</option>
<option>Hostels</option>
<option>Hotels</option>
</select></td>
<td><table width="90%" align="center" cellpadding="2">
<tr><th>Trip</th><th>Num</th><th>Base</br>cost</th><th>Accom.</br>Surcharge</th><th>Total</th></tr>
<tr><td><input type="text" name="trip1" class="text" readonly></td><td><input type="text" name="num1" size="1" class="text" readonly></td><td><input type="text" name="cost1" class="text" readonly></td><td><input type="text" name="accom1" class="text" readonly></td><td><input type="text" name="total1" class="text" readonly></td></tr>
<tr><td><input type="text" name="trip2" class="text" readonly></td><td><input type="text" name="num2" size="1" class="text" readonly></td><td><input type="text" name="cost2" class="text" readonly></td><td><input type="text" name="accom2" class="text" readonly></td><td><input type="text" name="total2" class="text" readonly></td></tr>
<tr><td><input type="text" name="trip3" class="text" readonly></td><td><input type="text" name="num3" size="1" class="text" readonly></td><td><input type="text" name="cost3" class="text" readonly></td><td><input type="text" name="accom3" class="text" readonly></td><td><input type="text" name="total3" class="text" readonly></td></tr>
<tr><td><input type="text" name="trip4" class="text" readonly></td><td><input type="text" name="num4" size="1" class="text" readonly></td><td><input type="text" name="cost4" class="text" readonly></td><td><input type="text" name="accom4" class="text" readonly></td><td><input type="text" name="total4" class="text" readonly></td></tr>
</table></td></tr>
</tr>
<tr><td><input type="button" value="Add to Invoice" onclick="addit()"/></td><td><input type="button" value="Clear" onclick="deleteit()"/></td><td><input type="button" value="Buy Now" onclick="submitform()"/></td><td align="right">Total Sale:<input type="text" name="total" readonly/></td></tr>
</table></form>
</body>
</html>
Hi all, I'm a beginner in JavaScript can someone please help me to resolve this issue and thanks in advance for your help! What I'm trying to do is.. When you select multiple <div> get the value of each one and save in separate hidden fields accordingly. What needs to happen is... Click div 1 --> if hidden field1 value is "none", save there, else check hidden field 2 if that's "none" save in hidden field 2 Click div 2 --> if hidden field1 value is "none", save there, else check hidden field 2 if that's "none" save in hidden field 2 Here's what I've come up with so far (currently I'm using JQuery) The problem with this is that no matter what div I click in which order it only updates the 1st hidden field Code: <div id="click1" name="click1" value="123" onclick="abc()"/>Click 1</div>
<div id="click2" name="click2" value="225" onclick="def()"/>Click 2</div>
<input id="passenger_1" name="passenger_1" type="hidden" value="none" />
<input id="passenger_2" name="passenger_2" type="hidden" value="none" />
<script>
function abc() {
var pasvalue = $('#click1').attr('value');
var pas1_value = $('#passenger_1').attr('value');
var pas2_value = $('#passenger_2').attr('value');
if(pas1_value == "none"){
$('#passenger_1').attr('value', pasvalue);
}else if (pas2_value == "none"){
$('#passenger_2').attr('value', pasvalue);
}}
function def() {
var pasvalue = $('#click2').attr('value');
var pas1_value = $('#passenger_1').attr('value');
var pas2_value = $('#passenger_2').attr('value');
if(pas1_value == "none"){
$('#passenger_1').attr('value', pasvalue);
}else if (pas2_value == "none"){
$('#passenger_2').attr('value', pasvalue);
}}
</script>
Hello, I just joined the forum. I'm hoping someone could help me out or point me in the right direction. I am trying to set up a simple interaction for users. The user would be required to select a width then height from two separate drop down menus. I used this as an example to work from: http://www.w3.org/TR/WCAG20-TECHS/wo...dynselect.html The list of heights would not be available until the user selects a width.(similar to the example link above). Each width would have slightly different heights associated with it. After the user selects a width then height an image would be displayed based on that combination. So for example if the user selects 12w/30h they would see "01.jpg" if the user selects 12w/36h they would see "02.jpg". This would all be done on the same page. The user should be able to update the image by combining the different width/height options indefinitely. If anyone has a link to an example or can provide a basic structure I could build of off I would be extremely grateful, thanks. Hi All, I'm using Philip M's great Javascript tutorial "Triple Combo Box" to populate three combo boxes on my site. The problem i'm having is that I use the combo boxes to allow users to submit a DB search request using GET Form and I need to have the submitted parameters "selected" when the search result page loads. I've searched all over the internet and I can't seem to find a usable solution so any help would be GREATLY appreciated. Thanks! If you need more information, lemme know! Nick My goal is that when I click on the submit button, I just want to display an alert box with the values selected, and also look at this in the console.log. Can anyone help me? Thanks. Code: <html>
<head>
</head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(init);
function init() {
$ ("#t").submit(function() {
var g = showCheckedValues();
console.log(g);
alert(g);
});
function showCheckedValues() {
// Gather all values of checked checkboxes with name "bedrooms".
var checked = $('input[name=bedrooms]:checked').map(function() {
return this.value;
}).get();
}}
</script>
<body>
<form id="t">
<input type="checkbox" name="bedrooms" value="1">1 bedroom<br>
<input type="checkbox" name="bedrooms" value="2">2 bedroom<br>
<input type="checkbox" name="bedrooms" value="3">3 bedroom<br>
<input type="checkbox" name="bedrooms" value="4+">4+ bedroom<br>
<input type="submit" name="save-changes"></input>
</form>
</body>
</html>
Hi there! I have two iframes, within each iframe are four drop down list boxes. On my main page I have one text input box and one text area input box. Aim: 1. Retrieve all the values. 2. Place them into a hidden form. 3. Submit the hidden form data to a Google Docs Spreadsheet. I need to export: (in this order, all are within form tags) "List1,2,3,4" (drop down lists) from form "initiatorform" within frame "initiatorframe" which is "initiator.html" "List5,6,7,8" (drop down lists) from form "finisherform" within frame "finisherframe" which is "finisher.html" "ComboName" (Text input box) and "Description" (text area input) from form "indexform" within "Index.html" I've been trying different pieces of code for the last few days with no luck. I've been using an alert to test whether the value has been recorded but it won't even pop up at all. I've been trying to use this example. Is this the correct format for what I'm trying to do? Code: <script language="JavaScript" type="text/javascript">
<!--
function whatever(iframeid,iframename){
mmspobj=document.getElementById(iframeid);
if (mmspobj.tagName=='IFRAME'){
mmsiobj=window.frames[iframename].document.getElementId('myfield1ID').value;
alert(mmsiobj);
}
alert(mmsiobj);
}
//-->
</script>
I'm just trying to retrieve the value atm, once its working I can set the hidden form data. I'm sorry if this is something simple but I've been teaching myself over the last week while making Google Apps. Any help would be greatly appreciated. i'm trying to "post" the selected checkboxes (name and value) into a mysql database; i've search "docter google" for some answers and read that the "easiest" way to do this is to collect the checkboxes and put the values and names in to an hidden textfield ( function setvalue() ) and collect this textfield in a new page with php; but this doesn't work. it seems that the variable naamtest is empty (when i load a word into this var arv it does work) can someone find my error? Code: <script type="text/javascript">
function shift(which)
{
var counter = 0; // counter for checked checkboxes
var i = 0; // loop variable
var veck = "";// final url variable
var beginsaldo = 79;
var namen_array = "";
var va_array = "";
var namen = "";
var valu = "";
var input_obj = document.getElementsByTagName('input'); // get a collection of objects with the specified 'input' TAGNAME
for (i=0; i < input_obj.length; i++){ // loop through all collected objects
if (input_obj[i].type == 'checkbox' && input_obj[i].checked == true){ // if input object is checkbox and checkbox is checked then ...
counter++; // ... increase counter
var valcheck = input_obj[i].value; // waarde van de geselecteerde checkbox in variable steken
test = Number(valcheck); // absolute rekenwaarde van variable maken
beginsaldo -= test; //beginsaldo verminderen met de checkbox value
if (counter > 0){
var naam = input_obj[i].name + ' ';
var val = input_obj[i].value + ' ';
namen = namen + naam;
valu = valu + val;
namen_array = namen.split(" ");
va_array = valu.split(" ");
var naamtest = namen_array;
}}}
if (counter > 10){
alert ("u mag maar 10 renners selecteren");
var tr = which.parentNode;
while ( tr.tagName.toUpperCase() != "TR" )
{
tr = tr.parentNode;
if ( tr == null ) return; // something went very wrong!
}
var tds = tr.getElementsByTagName("td");
tds[0].getElementsByTagName("input")[0].checked = false;
}
else if (beginsaldo < 0){
alert ("uw saldo is te laag om dit uit te voeren");
var tr = which.parentNode;
while ( tr.tagName.toUpperCase() != "TR" )
{
tr = tr.parentNode;
if ( tr == null ) return; // something went very wrong!
}
var tds = tr.getElementsByTagName("td");
tds[0].getElementsByTagName("input")[0].checked = false;
}
else{
var tr = which.parentNode;
while ( tr.tagName.toUpperCase() != "TR" )
{
tr = tr.parentNode;
if ( tr == null ) return; // something went very wrong!
}
var tds = tr.getElementsByTagName("td");
if ( tds[0].getElementsByTagName("input")[0] == which )
{
tds[2].innerHTML = tds[0].innerHTML;
tds[0].innerHTML = " ";
tds[3].innerHTML = tds[1].innerHTML;
tds[1].innerHTML = " ";
tds[2].getElementsByTagName("input")[0].checked = true;
} else {
// this code is optional!!
tds[0].innerHTML = tds[2].innerHTML;
tds[2].innerHTML = " ";
tds[1].innerHTML = tds[3].innerHTML;
tds[3].innerHTML = " ";
tds[0].getElementsByTagName("input")[0].checked = false;
}
function setValue()
{
var arv = naamtest.join();
// This line converts js array to String
document.f2.arv.value=arv;
// This sets the string to the hidden form field.
}}}
</script>
I have a form which contains a few drop down lists. The contents of the dropdown lists are dependent on each other and are populated via php scripts which are called each time a selection is made or changed by the user. When the view results button is clicked in the form I need the user to be directed to a specific page based on the selections they have made. The url of the page they need to be directed to is really based on what has been chosen in the first dropdown. The subsequent dropdowns form variables that I need to be sent to the page so that the data the user sees on that page is relevant. ie if the user has chosen bikes then a specific manufacturer then a specific price range the page they will be sent to will be the bike.php page with all the manufacturer specific bikes in their chosen price range visible. Can anyone tell me the best way to go about doing this please? I had thought about using the php header script along with an if statement but how do I then go about getting the variables sent to the page to be recognised? Would I be better looking at the window.location in js to do this? Any help and advice would be greatly appreciated on this. I can post the code for the form if that makes any difference. Hey javascript newbie, Im trying to figure out how to add different radio if its selected or not example: Radio_Button1 value="5": Selected Radio_Button2 value="15": Not Selected Radio_Button3 value="25": Selected Radio_Button4 value="35": Selected var addingitup = ??? and im lost???? total score from selected drop down values Hello friends the following is the code i am using without success Code: var numQuestn = 6;
function GetScore(form) {
var score = 0;
var item = 0;
var currQuestn = 0;
for (i = 0; i < numQuestn; i++) {
item = form.q1.selectedIndex; {
score += eval(form.q1.options[item].value);
}
item = form.q2.selectedIndex; {
score += eval(form.q2.options[item].value)
}
item = form.q3.selectedIndex; {
score += eval(form.q3.options[item].value)
}
item = form.q4.selectedIndex; {
score += eval(form.q4.options[item].value)
}
item = form.q5.selectedIndex; {
score += eval(form.q5.options[item].value)
}
item = form.q6.selectedIndex; {
score += eval(form.q6.options[item].value)
}
}
form.total.value = score
}
i am not able to find the error Please help me Thank you in advance |
|||||||