CODEWITHSUNDEEP
javascriptjquery
richardpixel
richardpixel

Reputation: 291

Change href parameter using jQuery after select change

I need to change a couple of href parameters using jQuery and driven by two form select options. The below example works perfectly but is driven from a text input and having problems converting it to work with a select.

https://stackoverflow.com/a/6540265/460322

I know this shouldn't be too hard but I have a stinking cold and brain is like mush this morning!

My code so far that doesn't work:

$(window).load(function(){

function updateNameValue() {
    $('#changelink').val($('#option1 option:selected').attr('href', function(i,a){
        return a.replace( /(field16=)[a-z]+/ig, '$1'.target.value ));
    });
});

$('#option1').change(updateNameValue);

updateNameValue();
});

Upvotes: 0

Views: 6085

Answers (2)

richardpixel
richardpixel

Reputation: 291

I ended up using the following code:

function changeHref(){
 arg1 = $('#o1').val();
 arg2 = $('#o2').val();
 if (!arg1)
    arg1 = 'default1';
 if (!arg2)
    arg2 = 'default2';
 link = "link.html?arg1=" + arg1 + "&arg2=" + arg2;
 $('#updateLink').attr("href",link)
}

$('.linkUpdater').change(function(){
 changeHref();  
});

changeHref();

With this HTML:

<select class="linkUpdater" id="o1">
    <option value="">Select</option>
    <option value="option1">Option 1</option>
    <option value="option2">Option 2</option>
</select>
<select class="linkUpdater" id="o2">
    <option value="">Select</option>
    <option value="optionA">Option A</option>
    <option value="optionB">Option B</option>
</select>

<a id="updateLink" href="link.html">Link</a>

Upvotes: 1

Karthik Rao
Karthik Rao

Reputation: 320

EDIT: This should work - jsfiddle.net/9dGdC

First, set the value attribute of each option tag in the select field to the respective href value, as shown below.

<select>
 <option value="www.example.com">Option 1</option>
</select>

Then, use this code : 

$('select').change(function(){
 $('.link').attr('href',$(this).val())
});

This will change the href attribute of the link!

Upvotes: 0

Related Questions