Solved

Trying tp pass value  from html option select to website

Posted on 2014-01-08
13
375 Views
Last Modified: 2014-01-09
Trying to pass xxxxx or yyyyy  depending upon option selected.  just doing the post with out the option works fine.  

like this
<input type = "hidden" name = "LinkId" value ="xxxxx" />

Trying to us the following.  I know I am doing something stupid. thanks

<script type="text/javascript">
function changeValue(){
    var option=document.getElementById('linkld').value;

    if(option=="A"){
            document.getElementById('field').value="xxxxx";
    }
        else if(option=="B"){
            document.getElementById('field').value="yyyyy";
        }

}
</script>
</head> 
<body> 



<form name="PrePage" method = "post" action = "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx">		

		<select name="linkld" id="linkld" onchange="changeValue();">
                	  <OPTION Value="A">Single Person Household - $20.00</OPTION>
                    <OPTION value="B">2 Person Household - $30.00</OPTION>
                    
                </SELECT>
				
							
				<input type = "text" name = "linkld" ID="field" value="" />
		<input type="submit" value="Add to Cart"/>	
	</form>		

Open in new window

0
Comment
Question by:wkrasner
  • 5
  • 4
  • 2
  • +2
13 Comments
 
LVL 38

Expert Comment

by:Tom Beck
ID: 39766543
var options=document.getElementById('linkld').options;

Will get you an array of the options in the select block.

Loop through them to look for option "A" or "B" value.
0
 
LVL 5

Author Comment

by:wkrasner
ID: 39766558
Thank you not sure I follow you.  My question is not on the Java side but rather on the html side  I can get the xxxxx or yyyy to appear in a text box  but doesn't pass to the post using a hidden
0
 
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39766564
Your js had an extra curly bracket
   var option=document.getElementById('linkld').value;

    if(option=="A"){
   
            document.getElementById('field').value="xxxxx";
    }
        else if(option=="B"){
            document.getElementById('field').value="yyyyy";
        }

Open in new window


Are you trying to pass a request form to javascript?  Or just trying to have the javascript detect what is selected by changing the option or clicking a button?
0
Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 82

Expert Comment

by:leakim971
ID: 39766576
Check this : http://jsfiddle.net/KSXt5/1/

function changeValue(option){
    if(option=="A") document.getElementById('field').value="xxxxx";
    else
    if(option=="B") document.getElementById('field').value="yyyyy";
}

Open in new window


I updated the onchange attribute :
<form name="PrePage" method = "post" action = "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx">		
    <select name="linkld" id="linkld" onchange="changeValue(this.value);">
        <option>Choose one</option>
        <OPTION value="A">Single Person Household - $20.00</OPTION>
        <OPTION value="B">2 Person Household - $30.00</OPTION>
     </select>
    <input type="text" name = "linkld" ID="field" value="" />
    <input type="submit" value="Add to Cart"/>	
</form>	

Open in new window

0
 
LVL 58

Expert Comment

by:Gary
ID: 39766591
Wouldn't it be easier to just put the values directly in the VALUE of the option?
0
 
LVL 5

Author Comment

by:wkrasner
ID: 39766615
Cathal

That's exactly what I want to do, how would I? I need to pass the selected value as a hidden type input?

also the input line I am using is:

<input type = hidden" name = "linkld" ID="field" value="" />

not what I have above.  Above just returns xxxx or yyyy into the text box
0
 
LVL 58

Expert Comment

by:Gary
ID: 39766642
Instead of
<OPTION Value="A">Single Person Household - $20.00</OPTION>

why not have it there to start with i.e.

<OPTION Value="xxxx">Single Person Household - $20.00</OPTION>

and get rid of the javascript and the hidden field

I'm confused why you have two elements (the dropdown and the hidden field) with the same name linkld if you are only wanting to pass one value.
0
 
LVL 5

Author Comment

by:wkrasner
ID: 39767912
This is what I am trying to Use,  without the Javascript.  But is doesn't pass the value

<form name="PrePage" method = "post" action = "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx">		
    <select name="linkld" id="linkld" >
        <option>Choose one</option>
        <OPTION value="6e6f6b1c-7d13-4a99-b8ab-e2791884aae6">Single Person Household - $20.00</OPTION>
        <OPTION value="8d8bf5a3-aab1-442e-8869-6741639e421c">2 Person Household - $30.00</OPTION>
     </select>
       <input type="submit"  id="linkld" value="Add to Cart"/>	
</form>	

Open in new window


The following is the syntax that does work with a button rather than an select option:

01.
<form name="PrePage" method = "post" action = "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx"> <input type = "hidden" name = "LinkId" value ="6e6f6b1c-7d13-4a99-b8ab-e2791884aae6" /> <input type = "image" src ="//content.authorize.net/images/buy-now-gold.gif" /> </form>

Open in new window

0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39767928
please note ID attribute MUST BE unique in a document unlike class or name attributes.
Also attribute values are case sensitive.

name = "LinkId"
is not
name = "linkid"
or
name = "linkId"

your working and not working code have different name attribute value, the case is different...
0
 
LVL 5

Author Comment

by:wkrasner
ID: 39767998
Thank you.  I have made the changes as follows.  Still doesn't work.
<form name="PrePage" method = "post" action = "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx">		
    <select name="Linkld" id="Linkldx" >
        <option>Choose one</option>
        <OPTION value="6e6f6b1c-7d13-4a99-b8ab-e2791884aae6">Single Person Household - $20.00</OPTION>
        <OPTION value="8d8bf5a3-aab1-442e-8869-6741639e421c">2 Person Household - $30.00</OPTION>
     </select>
       <input type="submit"   value="Add to Cart"/>	
</form>	

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 39768012
"LinkId"
"Linkld"

:(
0
 
LVL 82

Expert Comment

by:leakim971
ID: 39768031
did you saw the difference in my previous comment?
0
 
LVL 5

Author Comment

by:wkrasner
ID: 39768451
thanks.  I am stupid.  it looked like an l to me just changed the font and saw the diff.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to resize a div in html 3 37
Head to not include on scroll 4 23
ASP.NET Content Page 3 27
On Load function does not trigger on iPhone 4 32
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question