Link to home
Create AccountLog in
Avatar of john80988
john80988

asked on

append dropdown value to hyperlink with jquery

say i have a drop down and hyperlink

<select id="attribute_input_27" name="oa_attributes[27]" onchange="calcAttrPrice()">
<option value="p1">p1</option>
<option value="p2">p2</option>
<option value="p3">p3</option>
</select>

<a href="contact/?attribute=xxx">click here</a>

want people click the hyper link the link will goto attribute=p1 / p2 or p3 base on value, how? please help expert!
Avatar of sivagnanam chandrakanth
sivagnanam chandrakanth
Flag of India image

<select id="attribute_input_27" name="oa_attributes[27]" onchange="calcAttrPrice()">
<option value="p1">p1</option>
<option value="p2">p2</option>
<option value="p3">p3</option>
</select>

<a id="someid" href="contact/?attribute=xxx">click here</a>

var parameter=$("#attribute_input_27").value;
$("#someid").attr("href", "contact/?attribute="+parameter);

Refer

 http://stackoverflow.com/questions/179713/how-to-change-the-href-for-a-hyperlink-using-jquery

http://stackoverflow.com/questions/1334083/how-to-change-href-attribute-of-a-link-using-jquery
Avatar of Jagadishwor Dulal
I think you are looking for this:
<select id="attribute_input_27" name="oa_attributes[27]">
<option value="" selected disabled>Select</option>
<option value="p1">p1</option>
<option value="p2">p2</option>
<option value="p3">p3</option>
</select>
<script>
    $(function(){
      // bind change event to select
      $('#attribute_input_27').bind('change', function () {
          var url = $(this).val(); // get selected value
          if (url) { // require a URL
             $('#someid').attr('href','contact/?attribute='+ url);
          }
          return false;
      });
    });
</script>
<a id="someid" href="#">click here</a>

Open in new window


Add jquery source
Avatar of john80988
john80988

ASKER

Yes this is want i need, can it also initial select the first time loaded value? Please help master expert. TQ
I mean when page loaded before i click the dropdown, can it initial append the selected value for the first time.
ASKER CERTIFIED SOLUTION
Avatar of sivagnanam chandrakanth
sivagnanam chandrakanth
Flag of India image

Link to home
membership
Create an account to see this answer
Signing up is free. No credit card required.
Create Account
it should work, but it give me http://someurl.com/contact/?attribute=undefined

i think when teh time it get the value , the dropdown still haven't fill in the dropdown value from db

it it possible to initial the value after all the thing load?
yea add selectedindex=0;
Find the selected element using:
$("#elementid option").index($("#elementid option:selected")))

Open in new window


And now add selected attribute:
$("#elementid").val("value").attr("selected","selected")

Open in new window