On selection change replace part of a href

On selection change replace part of a href

Hello there,

I am wondering if anyone can help me with this problem.

Shortly: I have a drop down selection with multiple options, all I want to do is on change of this selection (when user choose another option), it get the value of the new selected option and submit it in href tag instead of another part in this href (replace with part of href).

Problem: everything works fine for the first selection change, but if the user decided to select another option (second, or third time), it doesn't get the new selected option value, it keep the value of the first selected option,
it is like I need a realtime change.

Example:

HTML

  1. <a class="link" href="http://www.google.com/hotel/replacement-part/">Check Availability</a>
  2. <label>Property</label>

  4.        <select id="combobox">
  5.             <option value="noselection">Select your Preferred Hotel</option>
  6.             <option value="A">ABC</option>
  7.             <option value="B">BCD</option>
  8.             <option value="D">DOS</option>
  9.             <option value="C">CAM</option>
  10.         </select>


jQuery

  1. $("#combobox").change(function(){
  3. var hotel = $(this[this.selectedIndex]).val();
  5. $('a').each(function(){
  7.         this.href = this.href.replace ('replacement-part', hotel);
  9.     });
if you change the selection to option value: B, it will replace part of href, but if you then change the selection to another option (e.g. D), it will not replace the replacement part of href to the new value which is D, it just will keep it with the first selection option value which was B.


Thank you.
Best,
EF.