parameter in URL

Dear Experts,

I am a beginner in HTML <option> usage.
The code used to be able to take a value from a drop down, and then go to a website with a link with that value.

<select name="assoc" onchange="prepLink(this.options[this.selectedIndex].value);">
<option value="22">22Mad</option>
<p><!-- Quality Rentals 22 Madison --></p>
<option value="20">20PROSP</option>
<p><!-- Quality Rentals 20 Prospect --></p>
<option value="21">21MADIS</option>
<p><!-- Quality Rentals 21 Madison --></p>
</select>
<a style="text-decoration: underline;"href="https://www.smartstreet.com/payment.aspx?a=501">Click HERE.</a>

where the end of the line was a=501&b=(value)

Now I cannot figure out how to plug in the variable "value" to the end of the link.
Please advise.
yballanAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Chris StanyonWebDevCommented:
You'd would either need to put the full url into the value, dynamically build the A href when the <option> changed, or dynamically add the <option> value to the A Href when it was click, probably by using jQuery or similar. Let us know which you'd prefer and we can talk you through it
Dave BaldwinFixer of ProblemsCommented:
Two things:  #1 you can't put the <p> lines in between the options and have it work properly.  #2 the only thing that gets sent is the 'value', nothing else.  But that only happens when the <select> is part of a <form>.  By itself without being in a <form>, <select> would require javascript to do everything.
yballanAuthor Commented:
Dear Chris, Thank you for your quick response.  I think jQuery would be good.  Please advise.
Dear Dave, Thank you for your quick response, and pointing out the problems.  Not sure why this used to work the way it was, though.
Is it possible because it is within Wordpress, and it uses plug-in?  It does not look it, though.
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

Chris StanyonWebDevCommented:
Here's a quick and simple solution:

//HTML
<select name="assoc">
  <option value="0" selected>Select Your Option</option>
  <option value="22">22Mad</option>
  <option value="20">20PROSP</option>
  <option value="21">21MADIS</option>
</select>

<a id="myLink" href="https://www.smartstreet.com/payment.aspx?a=501">Click HERE.</a>

Open in new window

//jQuery
$(document).ready(function() {
    rawLink = $('#myLink').attr('href');
    $('[name=assoc]').change(function() {
        $('#myLink').attr('href', rawLink + '&b=' + $(this).val());
    });
});

Open in new window

yballanAuthor Commented:
I am using HTML code, because that is what was there. but I still get
https://www.smartstreet.com/payment.aspx?a=501
and not
https://www.smartstreet.com/payment.aspx?a=501&b=22

???
Chris StanyonWebDevCommented:
Post up your code or a link to your site and I'll take a look
Olaf DoschkeSoftware DeveloperCommented:
The normal way to get parameters to a URL (action) is creating a HTML form with method="GET".

<form name="payment" method=GET action="https://www.smartstreet.com/payment.aspx"> 
<input type=hidden name=a value=501>
<select name="assoc">
<option value="22">22Mad</option>
<p><!-- Quality Rentals 22 Madison --></p>
<option value="20">20PROSP</option>
<p><!-- Quality Rentals 20 Prospect --></p>
<option value="21">21MADIS</option>
<p><!-- Quality Rentals 21 Madison --></p>
</select>
<a style="text-decoration: underline;" onclick="payment.submit();">Click HERE.</a>
</form>

Open in new window

That might not be the ASP.NET way to do it, though.

Bye, Olaf.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
yballanAuthor Commented:
Thank you, Chris,  Here it is.

<h2 class="pagetitle">Payment Center</h2>
<div id="post-258" class="post-258 page type-page status-publish hentry">
<div class="entry">

You can now pay your maintenance / rent directly ON-LINE
using a Checking Account or Credit Card, through our partnership with SmartStreet.com<code></code>
<h3>Please select your association :</h3>
<p><script type="text/javascript" src="/scripts/apm.js"></script></p>
<div>
<select name="assoc"

<option value="14">0078HIGH</option>

<option value="1">0SEVILLE</option>

<option value="26">CARLTONS</option>

<option value="17">CHOCOLAT</option>

</select>
</div>
<div style="margin-top: 35px;">
<h4>New Clients</h4>
Go directly to the
<a sid="myLink" href="https://www.hoabankservices.com/OnlinePayments/payment.aspx?a=501">Click HERE.</a>

</div>

</div>
</div>
yballanAuthor Commented:
Dear Chris, As I was sending you a code, I realized that I have not checked the JS within, and now I see where it went wrong.
Dear Olaf, I used your code as a template and got it to work.

Thank you, Experts!!!
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.