Power By 专否社区

Use Value of Selected Item in List to Redirect Browser Accordingly [HTML]

Go To StackoverFlow.com

0

Suppose I have a list box with different items, each with unique values, and an 'Enter' button below it. I want to be able to get the value of the selected item at the time of click, and then when have the button property:

ONCLICK="window.location.href='http://somewebsite.com/somefile.php?id="thisvalue"'"

So for example, something like----

<SELECT NAME = ParticipantList STYLE = "WIDTH: 187" SIZE = 18>
    <OPTION VALUE='hi'> hello </OPTION>
<SELECT>
<INPUT TYPE="submit" VALUE="Info" ONCLICK="window.location.href='http://helloworld.com/this.php?="hi"'"/>

Can anyone help me figure this out? Much appreciated.

2012-04-04 01:20
by Ruben Martinez Jr.
Why do you have HTML/PHP in your title?, seems like you need this solution using javascript/html - Zubair1 2012-04-04 01:36
Would jQuery be ok - Zubair1 2012-04-04 01:36
jQuery would be fine. Sorry, I left PHP in the title because I had originally structured this question (I use PHP mixed in my ListBox) as it pertained to my particular scenario, rather than this more general form. I'll remove it - Ruben Martinez Jr. 2012-04-04 01:54
i posted my answer below, let me know if it works for you - Zubair1 2012-04-04 02:10

1

HTML forms are designed to do exactly this when their method is GET:

<form action="http://helloworld.com/this.php" method="get">
  <select name="ParticipantList">
    <option value="hi">Hello</option>
  </select>

  <input type="submit">
</form>

This will send the user to http://helloworld.com/this.php?ParticipantList=hi. No JavaScript required.

2012-04-04 01:59
by Brandan
I ended up taking this course of action, with a slight modification. Because I have multiple submit buttons that take different actions, I defined the form action in Javascript within the button attributes, i.e. ONCLICK="javascript: FORM2.action='http://helloworld.com/this.php' - Ruben Martinez Jr. 2012-04-04 02:35

1

The Javascript 

<script type="text/javascript">
function doAction(){
    var selected = document.getElementById('ParticipantList').value;
    if (selected == 'hello'){
        window.location.href = 'http://somewebsite.com/somefile.php?id=1';
    } else if (selected == 'bye'){
        window.location.href = 'http://somewebsite.com/somefile.php?id=2';
    } else {
        alert('unknown option selected');
    }
}
</script>

The HTML 

<select name="ParticipantList" id="ParticipantList">
    <option value="hello">hello</option>
    <option value="bye">bye</option>
</select>

<input type="button" name="action" id="action" value="Submit" onclick="doAction()" />
2012-04-04 02:09
by Zubair1
Ads