Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    JS coding for onclick values.

    Hi, I am fairly new to this.

    I am looking to add an onclick value to open a new url when a particular airport (see code below) is selected. Where would each onclick value be placed and what should it look like? I have tried adding onclick values but to no avail! Any help would be greatly appreciated. The code I have (which can probably be improved upon) is the following:

    PHP Code:
    <div class="sign" style="margin-bottom:5px;">

    <
    div class="boxTopSepLeft"><div class="boxTopSepRight"></div></div>

    <
    div class="boxContentLeft"><div class="boxContentRight">

    <
    form method="GET" name="SelForm" class="alttxt" onsubmit="return check_form();" action="/cgi-bin/searching.pl?" >

    <
    input name="px" type="hidden" value="2" />

    <
    input name="agent" type="hidden" value="100615" />

    <
    input name="tmp" type="hidden" value="100615" />

    <
    input name="tc" type="hidden" value="g" />

    <
    input name="session" type="hidden" value="4f2f40bab764b3cccb97cc961dadf6ea" />

    <
    table width="350" border="0" align="center" cellpadding="3" cellspacing="6">

    <
    tr>

    <
    td width="85"><class="quoteBoxTitles">UK Airport:</b></td>

    <
    td width="275" colspan="2"><select size="1" name="ap" class="quoteFormBoxes">

    <
    option value="" selected>Select U.KAirport</option>

    <
    option value="ABZ">Aberdeen</option>


    <
    option value="BFS">Belfast</option>

    <
    option value="BHX">Birmingham</option>

    <
    option value="BRS">Bristol</option>

    <
    option value="CWL">CardiffWales</option>

    <!--
    option value="DOV">Dover</option-->

    <
    option value="DSA">Doncaster (Robin Hood)</option>

    <
    option value="MME">Durham Tees Valley</option>

    <
    option value="EMA">East Midlands</option>

    <
    option value="EDI">Edinburgh</option>

    <
    option value="EXT">Exeter</option>

    <
    option value="LGW">Gatwick</option>

    <
    option value="GLA">Glasgow</option>

    <
    option value="LHR">Heathrow</option>

    <
    option value="HUY">Humberside</option>

    <
    option value="LBA">Leeds/Bradford</option>

    <
    option value="LPL">Liverpool</option>

    <!--
    option value="LON">London</option-->

    <
    option value="LTN">Luton</option>

    <
    option value="MAN">Manchester</option>

    <
    option value="NCL">Newcastle</option>

    <
    option value="PIK">Prestwick</option>

    <
    option value="DSA">Sheffield (Robin Hood)</option>

    <
    option value="SOU">Southampton</option>

    <
    option value="STN">Stansted</option>

    <
    option value="MME">Teesside</option>

    </
    select>

    </
    td>

    </
    tr>

    <
    tr

  • #2
    New Coder
    Join Date
    Apr 2010
    Location
    Norfolk, England
    Posts
    63
    Thanks
    1
    Thanked 14 Times in 14 Posts
    Hi andyuk

    probably worth checking out an answer I gave to a very similar question on another forum:

    http://www.htmlforums.com/html-xhtml...it-140530.html

    //Improvement in coding is iterative, each 'failure' is just the next step on your learning curve, some knowledge and logic can get you a long way.//

  • #3
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    If you click on one of the airports, the <select> changes its value ... so I think you'll have to add an onchange="..." to the select.
    Code:
    <select size="1" name="ap" class="quoteFormBoxes" onchange="callURL(this.value)">
    
    Javascript:
    function callURL(myValue) {
       switch(myValue) {
          case "ABZ" : location.href = "http://www.whatever.com"; break;
          case "BFS" : location.href = "http://www.whatelse.com"; break;
          ...
       }
    }

  • #4
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks for your help so far guys, however when I said I was fairly new to this I probably meant very new!
    Is it possible for anyone to give a working example of say two of the airports linking to different sites ( each airport value will link to a different url), from which I can look at the code and add the rest? Im very confused about where I should be adding the examples given so far!

    Many thanks again.

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,310
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Here is another example:-

    Code:
    <html>
    <head>
    
    <script type = "text/javascript">
    function selectToNewWindow(form) { //default is 0; what loads is determined by option selected value
    var formindex=form.thislocation.selectedIndex;
    if(formindex<1){
    alert('Please make a selection from the list\n-  before you click the GO button   -')
    }
    if(formindex > 0){
    window.open(form.thislocation.options[formindex].value,"blank");}
    }
    
    </script>
    
    </head>
    
    <body>
    
    <p>Select a site from the 'drop down' boxes, then press GO. Each site opens in a new window.</p>
    <br>
    
    	<form id ="myform">
    	<select name="thislocation" size=1>
    	<option value selected="">Select a URL.....</option>
    	<option value="http://www.google.com">Google</option>
    	<option value = "http://www.yahoo.com/">Yahoo</option>
    	<option value="http://www.codingforums.com">Coding Forums</option>
    	<option value="http://www.javascriptkit.com">Javascript Kit</option>
    	</select>
    	<input type=button value="GO" style="background:00ff00" onClick="selectToNewWindow(this.form)">
    	</form>
    
    </body>
    </html>
    Instead of a button you could also use an onchange event in the select to call the script.
    Last edited by Philip M; 07-24-2011 at 04:59 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    andyuk (07-24-2011)

  • #6
    New Coder
    Join Date
    Apr 2010
    Location
    Norfolk, England
    Posts
    63
    Thanks
    1
    Thanked 14 Times in 14 Posts
    Quote Originally Posted by andyuk View Post
    Thanks for your help so far guys, however when I said I was fairly new to this I probably meant very new!
    Is it possible for anyone to give a working example of say two of the airports linking to different sites ( each airport value will link to a different url), from which I can look at the code and add the rest? Im very confused about where I should be adding the examples given so far!

    Many thanks again.
    Well my example will be confusing if you aren't accustomed to PHP, as its PHP based.

    I made it PHP based becuase some users may have JS disabled, and it is best practice to only use JS to enhance your site, rather than have site usage depend on JS.

    For that reason I gave a PHP example However, if you aren't familiar with PHP, get familiar with it , but in the short term use one of the other posters JS examples, as they may be easier to understand.
    //Improvement in coding is iterative, each 'failure' is just the next step on your learning curve, some knowledge and logic can get you a long way.//

  • #7
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks once again to all, it's slowly becoming clearer and I think I will be able to incorporate your ideas in to the site. Cheers!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •