Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

button on click get select value and do something

Tags:

html

jquery

  <div class="selCont">
        <h2>pick an option</h2>
        <select id="my-dropdown" name="my-dropdown">
            <option value="0">Please Select</option>
            <option value="1">West</option>
            <option value="2">Land</option>
            <option value="3">Easter</option>
            <option value="4">Springtime</option>
            <option value="5">Celtic</option>
            <option value="6">Spectacular/</option>
            <option value="7">Weekend</option>
            <option value="8">Dark</option>
            <option value="9">Treasures</option>
        </select>
        <button class="go-btn" type="submit">
        Go
        </button>
</div>

So basically i want to be able for a user to select an option, and upon hitting the go button, for a script to run and look at the value of the dropdown and use the value to send them to the relevant page.

I've been trying a few things but as of yet it's not hanging together too well. Any help appreciated as always.

EDIT

http://jsfiddle.net/TmfyC/ - Here is what is what ive tried most recently with the help from one of the comments.

*WHAT I USED FOR PEOPLE WHO IT MIGHT BENEFIT*

$('.go-btn').click(function() {
    window.location = $('#my-dropdown').val();
});

This is what i ended up doing, i then assigned the value as the url of my pages. Seems to work like a treat. Thanks for the help guys.

like image 948
Doidgey Avatar asked Jul 27 '12 11:07

Doidgey


People also ask

How do you get the selected button value?

To get the value of selected radio button, a user-defined function can be created that gets all the radio buttons with the name attribute and finds the radio button selected using the checked property.

How do you append to a select option?

Method 1: Append the option tag to the select boxThe select box is selected with the jQuery selector and this option is added with the append() method. The append() method inserts the specified content as the last child of the jQuery collection. Hence the option is added to the select element.

How do I get the selected option value in TypeScript?

First, create the template variables for dropdown using #teams . Use the event binding to listen for the change event and link with the onSelect method. The onSelect method receives the reference variable and takes the value of the dropdown element. Next, create the onSelected(value) method in the TypeScript file.


1 Answers

2 things : http://jsfiddle.net/xSyF2/1/ OR http://jsfiddle.net/xSyF2/

code

$('.go-btn').click(function() {
    var selected = $('#my-dropdown option:selected');
    alert(" If you want text ==>"  + selected.html()); 
});​

OR

$('.go-btn').click(function() {
    alert(" If you just want value ==>"  + $('#my-dropdown').val()); 
});​
like image 164
Tats_innit Avatar answered Nov 09 '22 21:11

Tats_innit