Some help needed to redirect onclick

Discussion in 'JavaScript' started by x0x, Jan 25, 2010.

  1. #1
    I have a simple dropdown:


    
    <select name="names">
    <option value="" selected> SELECT ONE</option>
                   
                           <option value="1"><?=$var['name']?></option>
                           <option value="2"><?=$var2['name']?></option>
                         </select>
    HTML:
    I have a button inside a form that posts data to x.php

    <input type="submit" name="view" value="VIEW" />
    HTML:
    The question is: is it possible to make that VIEW button to redirect to another page (not the page set by the form) on click? The page URL we are redirected to should contain the value from the NAMES dropdown. We should be redirected to y.php?nameid= the value from the names dropdown.

    Also, what is not so important but would still be cool. Could the button be disabled if nothing is selected from the dropdown? (besides the default SELECT ONE option)?
     
    x0x, Jan 25, 2010 IP
  2. harrierdh

    harrierdh Peon

    Messages:
    46
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You can trap the onSubmit event in the form tag. Then using a little javascript you could build a query string with parameters and redirect to a different page.

    Like this, not tested.
    <script>
    function redirectMyPage() {
    var mypage = "http://mypage.com/"
    mypage += "?";
    mypage += document.getElementById("myname").value;
    mypage += "&";
    mypage += document.getElementById("myage").value;
    location.href = mypage;
    }
    </script>
    <form onSubmit="redirectMyPage()">
    Enter your name:&nbsp;
    <input type="text" id="myname" /><br />
    Enter your age:&nbsp;
    <input type="text id="myage" /><br />
    <input type="submit" value="Click Me";
    </form>
     
    harrierdh, Jan 25, 2010 IP
  3. x0x

    x0x Well-Known Member

    Messages:
    510
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    110
    #3
    I couldn't get it to work.

    However there are other submit buttons in that form, I just want one of the buttons to take me to another page.

    Therefore I slightly tried modifying your code but I still couldn't get it to work. Here is what I did:


    <script>
    function redirectMyPage() {
    var mypage = "page.php?fid="
    mypage += document.getElementById("names").value;
    location.href = mypage;
    }
    </script>
    
     <form action="otherpage.php" method="post">
    
    <select name="names">
    <option value="" selected> SELECT ONE</option>
                   
    <option value="1">name 1</option>
    <option value="2">name 2</option>
    </select>
    
    
    <input type="submit" name="go" value="GO" />
    <input type="submit" onClick="redirectMyPage();" name="view" value="VIEW" />
    
    
    </form>
    
    Code (markup):
    The go button should do what it normally does... View is the button that has to redirect.
     
    x0x, Jan 25, 2010 IP
  4. x0x

    x0x Well-Known Member

    Messages:
    510
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    110
    #4
    EDIT: Got everything to work! Forgot that javascript needs id=blabla
     
    Last edited: Jan 25, 2010
    x0x, Jan 25, 2010 IP
  5. alexpr07

    alexpr07 Active Member

    Messages:
    284
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    73
    #5
    I believe you should not use two "submit" buttons in one form but it might work, never checked it.
    You can do something like this:
    <input type="submit" name="go" value="GO" />
    <input type="button" onClick="javascript:location='mypage.html';" name="view" value="VIEW" />
     
    alexpr07, Jan 27, 2010 IP