Select Drop Down with only one option as a link

Question

I am trying to figure out how to make one of the options in my select drop down a link that redirects to that page. So far from researching this I have only found a way to make all the options links that are redirected to (Load page on selection from dropdown form) but I only want one of the options to be a link. Also I need the link to work without hitting the submit button.

EDITED USING @VLADIMIR'S SUGGESTION:

    <form method="get" id="searchform" name="searchform" action="<?php echo home_url(); ?>/">
    <select name="posttype" id="selection">
            <option name="Product" value="Product">Legal Documents</option>
            <option name="videos" value="videos">Legal Advice - Videos</option>
             <option value="http://www.testing.com">An Attorney</option>
        </select>
 <input name="s" id="s" class="s" type="text" onfocus="if(this.value=='<?php _e('');?>') this.value='';" onblur="if(this.value=='') this.value='<?php _e('');?>';" value="<?php _e('');?>" />

<button tabindex="2" type="submit" class="search_btn"> 
    </button>

    <?php wp_dropdown_categories( 'taxonomy=videoscategory&show_option_all=All Practice Areas' ); ?>
    <?php wp_dropdown_categories( 'taxonomy=states&show_option_all=All U.S States' ); ?>

    </form>

    <script type="text/javascript">
    $(document).ready(function() {
        $("#selection").change(function() {
            var curVal = $("#selection option:selected").val();
            if (curVal.indexOf('http://') === 0) {
                location = $("#selection option:selected").val();
            }
        });
    });
    </script>

Also is there a way to have one option with multiple values?

score 1 · Accepted Answer · edited May 23 '17 at 11:56

1

You can adapt solution from the Load page on selection from dropdown form

Replace JS code with

$(document).ready(function() {
    $("#selection").change(function() {
        var curVal = $("#selection option:selected").val();
        if (curVal.indexOf('http://') === 0) {
            location = $("#selection option:selected").val();
        }
    });
});

The idea is that you check the option value and if it begins with 'http://', then you set new location.

edited May 23 '17 at 11:56

Community

1
1

answered Dec 21 '12 at 20:24

Vladimir

556
5
5

Hi thanks for your response. However Im not sure if I implemented it right because it is not working for me, I am going to update my question with what I currently have setup using your suggestion. – 730wavy Dec 21 '12 at 23:04
I have created jsFiddle example http://jsfiddle.net/Ap46a/ and it successfully redirects to www.testing.com. But I didn't understand what you want to achieve with multiples values for sungle option. Anyway you can change option value with JS - another jsFiddle example http://jsfiddle.net/KGaps/ – Vladimir Dec 22 '12 at 09:51

Select Drop Down with only one option as a link

1 Answers1