SitePoint Sponsor

User Tag List

Results 1 to 19 of 19
  1. #1
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    multiple arrays, choose array based on variable

    hi, i have a bit of a problem, i have recently created a form that that uses javascript to prefill an address textarea based on the value of a drop down menu. (the drop down lists passengers' names and when the user clicks a radio button it grabs the selected passenger's home address from an array and prefills a textarea, either the from or to text area)

    now that multiple users are going to be using this form i need to restrict what passengers each user can see (which causes problems with this address funtion i have)

    let me explain

    in my page i am going to have something like the following:

    Code:
    <p>Passenger:</p>
    <&#37;
    If r("tbl.ID") = 1 Then
    %>
    <p>
    <select id="passenger" name="passenger">
    <option value="">...</option>
    <option value="Passenger 1 for ID 1">Passenger 1 for ID 1</option>
    <option value="Passenger 2 for ID 1">Passenger 2 for ID 1</option>
    </select>
    </p>
    <%
    End If
    %>
    <%
    If r("tbl.ID") = 2Then
    %>
    <p>
    <select id="passenger" name="passenger">
    <option value="">...</option>
    <option value="Passenger 1 for ID 2">Passenger 1 for ID 2</option>
    <option value="Passenger 2 for ID 2">Passenger 2 for ID 2</option>
    </select>
    </p>
    <%
    End If
    %>
    etc.

    so the problem i have is that the current array in my function which holds the addresses wont know which passenger is active.

    what i need to do is edit the function to use an array based on the id (and input that value into the address field as it currently does)

    perhaps it would be something like..

    Code:
    var address for ID 1 = [
    '',
    '1 John Smith Street'
    ];
    
    var address for ID 2 = [
    '',
    '2 James Smith Street'
    ];
    etc

    i hope this is clear, a working version of the page can be seen below as well as the code.. as always any help with this is very much appreciated.

    preview page: http://www.londonheathrowcars.com/accounts-login.asp
    username: test
    password: test

    below is the code..
    Code:
    <%
    
    Response.Expires = 0
    Response.Expiresabsolute = Now() - 1
    Response.AddHeader "pragma","no-cache"
    Response.AddHeader "cache-control","private"
    Response.CacheControl = "no-cache"
    
    If session("mySecurity") <> "boggles" Then
    session("message") = "Error:  Not logged in"
    response.redirect("accounts-login-failed.asp")
    End If
    %>
    
    <%
    Set r = Server.CreateObject("ADODB.Recordset")
    r.ActiveConnection = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.mappath("_db_import/login.mdb")
      
    strSql = "SELECT tbl.ID, tbl.fullname, tbl.company, tbl.email FROM tbl WHERE tbl.ID = "& Session("userId")& ";"
    r.Open strSql
    
    %>
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     
    <head>
     
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
     
    <title>Form</title>
     
    <link rel="stylesheet" type="text/css" href="accountscript\actstyle.css" media="all" />
    <link rel="stylesheet" type="text/css" href="accountscript\ezcalendar.css" />
    <script type="text/javascript" src="accountscript\ezcalendar.js"></script>
    <script type="text/javascript" src="accountscript\jscript.js"></script>
    
    
    </head>
    
    <body>
    
    <div id="wrap" class="clearfix">
    <div id="top">
    		<img class="logo" src="images\Heathrow-Taxi-Logo.jpg" alt="London Heathrow Cars Header" />
    	</div>
    
    <h1 class="mid">Account Booking Form - <%=r("company")%></h1>
    
    <p class="mainpage">Welcome <b><%=r("fullname")%></b> to your private booking page.</p>
    <br />
    <form name="bookingform" method="post" action="send-account-booking.asp" onsubmit="return BookingComplete()">
    
    <input type="hidden" value="<%=r("fullname")%>" name="fullname" id="fullname">
    <input type="hidden" value="<%=r("company")%>" name="company" id="company">
    <input type="hidden" value="<%=r("email")%>" name="email" id="email">
    
    <table width="748">
    <tr><td align="left" valign="top" width="374">
    
    <p class="mainpage">Passenger:</p>
     
    <p><select class="droppy" id="passenger" name="passenger" style="margin-left:20px;width:150px;">
    <option value="">...</option>
    <option value="John Smith">John Smith</option>
    <option value="John Samon">John Samon</option>
    </select>
    
     
    
    <table id="direction">
    <tr>
    <td>
    <p class="mainpage"><input type="radio" value="Airport to Home" name="direction" id="airportToHome" />
       <label for="airportToHome">Airport to Home</label></p>
    </td>
    <td>
    <p class="mainpage"><input type="radio" value="Home to Airport" name="direction" id="homeToAirport" />
       <label for="homeToAirport">Home to Airport</label></p>
    </td>
    </tr>
    
    <tr>
    <td>
    <p class="mainpage"><input type="radio" value="Airport to Office Address" name="direction" id="airportToOffice" />
       <label for="airportToOffice">Airport to Office</label></p>
    </td>
    <td>
    <p class="mainpage"><input type="radio" value="Office Address to Airport" name="direction" id="officeToAirport" />
       <label for="officeToAirport">Office to Airport</label></p>
    </td>
    </tr>
    
    
    </table>
    
    <br />
    <p class="mainpage">* From:</p>
    <p><select class="droppy" id="fromairport" name="fromairport" style="margin-left:20px;width:275px;">
    <option value="">...</option>
    <option value="Heathrow Airport">Heathrow Airport</option>
    <option value="Heathrow Airport - Terminal 1">Heathrow Airport - Terminal 1</option>
    <option value="Heathrow Airport - Terminal 2">Heathrow Airport - Terminal 2</option>
    <option value="Heathrow Airport - Terminal 3">Heathrow Airport - Terminal 3</option>
    <option value="Heathrow Airport - Terminal 4">Heathrow Airport - Terminal 4</option>
    <option value="Heathrow Airport - Terminal 5">Heathrow Airport - Terminal 5</option>
    <option value="Gatwick Airport">Gatwick Airport</option>
    <option value="Gatwick Airport - North Terminal">Gatwick Airport - North Terminal</option>
    <option value="Gatwick Airport - South Terminal">Gatwick Airport - South Terminal</option>
    
    </select></p>
    <p><textarea style="margin-left:20px;width:275px;" class="long" id="from" name="from" rows="3"></textarea></p>
    
    <p class="mainpage">* To:</p>
    <p><select class="droppy" id="toairport" name="toairport" style="margin-left:20px;width:275px;">
    <option value="">...</option>
    <option value="Heathrow Airport">Heathrow Airport</option>
    <option value="Heathrow Airport - Terminal 1">Heathrow Airport - Terminal 1</option>
    <option value="Heathrow Airport - Terminal 2">Heathrow Airport - Terminal 2</option>
    <option value="Heathrow Airport - Terminal 3">Heathrow Airport - Terminal 3</option>
    <option value="Heathrow Airport - Terminal 4">Heathrow Airport - Terminal 4</option>
    <option value="Heathrow Airport - Terminal 5">Heathrow Airport - Terminal 5</option>
    <option value="Gatwick Airport">Gatwick Airport</option>
    <option value="Gatwick Airport - North Terminal">Gatwick Airport - North Terminal</option>
    <option value="Gatwick Airport - South Terminal">Gatwick Airport - South Terminal</option>
    
    </select></p>
    <p><textarea style="margin-left:20px;width:275px;" class="long" id="goingto" name="goingto" rows="3"></textarea></p>
    <br />
    
    
    </td>
    
    <td align="left" valign="top" width="374">
    
    <p class="mainpage">* Pickup date:</p>
    
    <p class="mainpage"><input style="background-color:#EBEBEB;margin-top:10px;width:100px;" name="date" id="date" type="text" size="10" maxlength="10" value="" />
    <a href="javascript: showCalendar('date')"><u>Choose a date</u></a></p>
    <br />
    
    <p class="mainpage">* Pickup time / flight arrival time:</p>
    <p><select id="pickuphour" name="pickuphour" class="droppy" style="margin-left:20px;width:100px;">
    		<option value="">Hour</option>
    
    	<option value="01">01 AM</option>
    	<option value="02">02 AM</option>
    	<option value="03">03 AM</option>
    	<option value="04">04 AM</option>
    
    	<option value="05">05 AM</option>
    	<option value="06">06 AM</option>
    
    	<option value="07">07 AM</option>
    	<option value="08">08 AM</option>
    	<option value="09">09 AM</option>
    	<option value="10">10 AM</option>
    
    	<option value="11">11 AM</option>
    	<option value="12">Midday</option>
    
    	<option value="13">01 PM</option>
    	<option value="14">02 PM</option>
    	<option value="15">03 PM</option>
    	<option value="16">04 PM</option>
    
    	<option value="17">05 PM</option>
    	<option value="18">06 PM</option>
    
    	<option value="19">07 PM</option>
    	<option value="20">08 PM</option>
    	<option value="21">09 PM</option>
    	<option value="22">10 PM</option>
    
    	<option value="23">11 PM</option>
    	<option value="24">Midnight</option></select>
    
    	<select class="droppy" id="pickupminutes" name="pickupminutes" style="width:100px;">
    	<option value="">Minute</option>
    	<option value="00">00</option>
    	<option value="05">05</option>
    
    	<option value="10">10</option>
    	<option value="15">15</option>
    
    	<option value="20">20</option>
    	<option value="25">25</option>
    	<option value="30">30</option>
    <option value="35">35</option>
    
    <option value="40">40</option>
    <option value="45">45</option>
    <option value="50">50</option>
    
    <option value="55">55</option></select></p>
    
    
    
    <p class="mainpage">Flight no:</p>
    <p><input style="margin-left:20px;width:100px;" type="text" class="txtbox" id="flightno" name="flightno" /></p>
    
    <p class="mainpage">Flight from:</p>
    <p><input style="margin-left:20px;width:150px;" type="text" class="txtbox" id="flightfrom" name="flightfrom" /></p>
    
    <p class="mainpage">Notes:</p>
    <p><textarea style="margin-left:20px;width:275px;" class="long" id="notes" name="notes" rows="3"></textarea></p>
    
    
    
    </td>
    
    </tr>
    
    </table>
    
    </form>
    
    <br /><br /> 
    <p><a href="accounts-logout.asp">logout</a></p>
    </div>
    
    
    <script>
    
    var address = [
    '',
    '1 John Smith Street',
    '1 John Samon Street'
    ];
    
    
    function toggleFields(origin, dest) {
        displayElement('fromairport', (origin === 'Airport'));
        displayElement('from', (origin !== 'Airport'));
        displayElement('toairport', (dest === 'Airport'));
        displayElement('goingto', (dest !== 'Airport'));
        displayElement('flightfrom', (origin === 'Airport'));
        displayElement('flightno', (origin === 'Airport'));
    }
    function displayElement(id, display) {
        var el = document.getElementById(id);
        if (display === true) {
            el.style.display = '';
        } else {
            el.style.display='none';
            el.value='';
        }
    }      
    function updateBooking(evt) {
        evt = evt || window.event;
        targ = evt.target || evt.srcElement;
        if (targ.nodeName !== 'INPUT') {
            return;
        }
        var passenger = document.getElementById('passenger');
        var passengerIndex = passenger.selectedIndex;
        var direction = targ.value.split(" to ");
        var origin = direction[0];
        var dest = direction[1];
        origin = (origin === 'Home') ? address[passengerIndex] : origin;
        dest = (dest === 'Home') ? address[passengerIndex] : dest;
        document.getElementById('from').value = origin;
        document.getElementById('goingto').value = dest;
        toggleFields(origin, dest);
    }
    document.getElementById('direction').onclick = updateBooking;
    
    
    (function () {
        var direction = document.getElementById('direction');
        var defaultRadio = document.getElementById('airportToHome');
        defaultRadio.click();
        direction.onclick = updateBooking;
        direction.onclick({target: defaultRadio});
    })();
    
    
    </script>
    
    </body>
    
    
    <%
    r.close
    %>
    </html>

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Can you not use asp to write the value directly in?

    Code html4strict:
    <p>Passenger:</p>
    <p>
    <select id="passenger" name="passenger">
    <option value="">...</option>
    <option value="Passenger 1 for ID <% r("tbl.ID") %>">Passenger 1 for ID <% r("tbl.ID") %></option>
    <option value="Passenger 2 for ID <% r("tbl.ID") %>">Passenger 2 for ID <% r("tbl.ID") %></option>
    </select>
    </p>

    You can also use asp to write a javascript value so that the script knows what's going on.

    Code html4strict:
    var activePassenger = <% r("tbl.ID") %>;

    I'm no expert on asp though, so perhaps the asp forums may be able to help as well.
    Classic ASP Forum
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the database at the moment doesnt hold any addresses so i cant use asp for the moment..


    i think you are on to something with

    Code:
    var activePassenger = <&#37; r("tbl.ID") %>;
    how would i incorporate that into the current function, basically everything in the javascript would need to stay the same, the only thing that would need to be different was the array that was used (which would be based on the ID)

    would something like the following still input the address value in exactly the same way but select the array to use based on the id?

    Code:
    <script>
    
    var activePassenger = <% r("tbl.ID") %>;
    
    if activePassenger = 1 then {
    
    var address = [
    '',
    '1 John Smith Street',
    '1 John Samon Street'
    ];
    
    end if
    }
    
    
    if activePassenger = 2 then {
    
    var address = [
    '',
    'Holiday House',
    'Adress Bla-di-blah'
    ];
    
    end if
    }
    
    
    
    if activePassenger = 3 then {
    
    var address = [
    '',
    'Random Adress Roadt',
    'Hotel Street'
    ];
    
    end if
    }
    
    
    
    
    function toggleFields(origin, dest) {
        displayElement('fromairport', (origin === 'Airport'));
        displayElement('from', (origin !== 'Airport'));
        displayElement('toairport', (dest === 'Airport'));
        displayElement('goingto', (dest !== 'Airport'));
        displayElement('flightfrom', (origin === 'Airport'));
        displayElement('flightno', (origin === 'Airport'));
    }
    function displayElement(id, display) {
        var el = document.getElementById(id);
        if (display === true) {
            el.style.display = '';
        } else {
            el.style.display='none';
            el.value='';
        }
    }      
    function updateBooking(evt) {
        evt = evt || window.event;
        targ = evt.target || evt.srcElement;
        if (targ.nodeName !== 'INPUT') {
            return;
        }
        var passenger = document.getElementById('passenger');
        var passengerIndex = passenger.selectedIndex;
        var direction = targ.value.split(" to ");
        var origin = direction[0];
        var dest = direction[1];
        origin = (origin === 'Home') ? address[passengerIndex] : origin;
        dest = (dest === 'Home') ? address[passengerIndex] : dest;
        document.getElementById('from').value = origin;
        document.getElementById('goingto').value = dest;
        toggleFields(origin, dest);
    }
    document.getElementById('direction').onclick = updateBooking;
    
    
    (function () {
        var direction = document.getElementById('direction');
        var defaultRadio = document.getElementById('airportToHome');
        defaultRadio.click();
        direction.onclick = updateBooking;
        direction.onclick({target: defaultRadio});
    })();
    
    
    </script>

  4. #4
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i know it is not the best way to do things but as a quick fix (which is what i currently need) would this work?

  5. #5
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That would work, here it is a little nicer:
    Code:
    <script>
    var addresses = {
    	"passenger_1": ['', '1 John Smith Street', '1 John Samon Street'],
    	"passenger_2": ['', 'Holiday House', 'Adress Bla-di-blah'],
    	"passenger_3": ['', 'Random Adress Roadt', 'Hotel Street']
    };
    
    var activePassenger = <&#37; r("tbl.ID") %>;
    
    var address = addresses["passenger_" + activePassenger];
    </script>

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    How about this:

    Code javascript:
    var addresses = [
    	['', '1 John Smith Street', '1 John Samon Street'],
    	['', 'Holiday House', 'Adress Bla-di-blah'],
    	['', 'Random Adress Roadt', 'Hotel Street']
    ];
    var address = addresses[<&#37; r("tbl.ID") %>];

    Or, you could use asp so that only the wanted addresses are provided. This is better from a security perspective as well.

    I'm not entirely sure about the asp syntax, but you'll be wanting something like this.
    Code asp:
    Dim addresses(3)
    addresses(1) = "['', '1 John Smith Street', '1 John Samon Street']"
    addresses(2) = "['', 'Holiday House', 'Adress Bla-di-blah']"
    addresses(3) = "['', 'Random Adress Roadt', 'Hotel Street']"
    response.write "var address = " + addresses(r("tbl.ID")) + ";"
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for the replies, i shall put into practice some of these suggestions and report back

    thanks again

  8. #8
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just to clarify on this, i would replace the following bold number with the id from the database??

    Code:
    <script>
    var addresses = {
    	"passenger_1": ['', '1 John Smith Street', '1 John Samon Street'],
    	"passenger_2": ['', 'Holiday House', 'Adress Bla-di-blah'],
    	"passenger_3": ['', 'Random Adress Roadt', 'Hotel Street']
    };
    
    var activePassenger = <&#37; r("tbl.ID") %>;
    
    var address = addresses["passenger_" + activePassenger];
    </script>

  9. #9
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    If the active passenger won't change between page loads, the asp code should provide only the minimum information that's required for the page to do its job.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  10. #10
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    if i use the asp array you have provided will i need to modify the javascript function at all or would it automatically take the values of address from that array?

  11. #11
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    From what I understand, you want the address array to be different depending on the table id.

    If it's 1 you want
    var address = ['', '1 John Smith Street', '1 John Samon Street'];
    if it's 2 you want
    var address = ['', 'Holiday House', 'Adress Bla-di-blah'];
    so let's do this from asp

    The suggestion is, that you use the following asp code to write out the appropriate line.

    Code asp:
    Dim addresses(3)
    addresses(1) = "['', '1 John Smith Street', '1 John Samon Street']"
    addresses(2) = "['', 'Holiday House', 'Adress Bla-di-blah']"
    addresses(3) = "['', 'Random Adress Roadt', 'Hotel Street']"
    response.write "var address = " + addresses(r("tbl.ID")) + ";"
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  12. #12
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you are correct, i want the avaiable addresses to b different based on which ID is active in the current session.

    having the address' on the page is fine, i'm just curious to know as to whether my javascript function will work as it does currently.

    at the moment i am storing the address' in a javascript array and prefilling various textareas with values from that array

    if i change the way the address' are delivered to the page, will i need to alter my javascript function to retain the current functionality of the form

    sorry if im confused

  13. #13
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    here is a snippet of your code

    Code html4strict:
    p><a href="accounts-logout.asp">logout</a></p>
    </div>
     
    <script>
     
    var address = [
    '',
    '1 John Smith Street',
    '1 John Samon Street'
    ];
     
    function toggleFields(origin, dest) {
        displayElement('fromairport', (origin === 'Airport'));

    Here is the proposed change


    Code html4strict:
    p><a href="accounts-logout.asp">logout</a></p>
    </div>
     
    <script>
     
    <&#37;
    Dim addresses(3)
    addresses(1) = "['', '1 John Smith Street', '1 John Samon Street']"
    addresses(2) = "['', 'Holiday House', 'Adress Bla-di-blah']"
    addresses(3) = "['', 'Random Adress Roadt', 'Hotel Street']"
    response.write "var address = " + addresses(r("tbl.ID")) + ";"
    %>
     
    function toggleFields(origin, dest) {
        displayElement('fromairport', (origin === 'Airport'));
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  14. #14
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i seee..

    ok, last question (promise)

    the IDs themselves will not be as straightforward as 1,2,3,4..

    they will most probably be 43, 45, 52.. etc.. (dont worry, im not going to have more than 10 or 20 address selections in this script)

    do i replace the

    addresses(this number) = ..

    with the ID of the active user, if i dont do this then i cant see how the code will know which array item belongs to which user ID.. (again, simply because the IDs wont be exactly sequential)

  15. #15
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    You can use the select statment for that

    Code asp:
    Select Case r("tbl.ID")
        Case 43
            set address = "['', '1 John Smith Street', '1 John Samon Street']"
        Case 45
            set address = "['', 'Holiday House', 'Adress Bla-di-blah']"
        Case 52
            set address = "['', 'Random Adress Roadt', 'Hotel Street']"
    End Select
    response.write "var address = " + address
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  16. #16
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    This is now becoming an ASP / VBSCRIPT discussion, so I suggest that the moderator may want to move this discussion to a more appropriate forum.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  17. #17
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hi, i know this is dabbling with VB Script but perhaps there are still answers within this post..

    im using the following:
    Code:
    <script>
    
    Select Case <&#37;=r("tbl.ID")%>
    
        Case 53
            set address = "['', 'this address', 'that address', 'another address']"
    	Case 55
            set address = "['', 'this address 2']"
        Case 57
            set address = "['', 'a different address', 'yet another address']"
    	
    End Select
    
    function toggleFields(origin, dest) {
        displayElement('fromairport', (origin === 'Airport'));
        displayElement('from', (origin !== 'Airport'));
        displayElement('toairport', (dest === 'Airport'));
        displayElement('goingto', (dest !== 'Airport'));
        displayElement('flightfrom', (origin === 'Airport'));
        displayElement('flightno', (origin === 'Airport'));
    }
    function displayElement(id, display) {
        var el = document.getElementById(id);
        if (display === true) {
            el.style.display = '';
        } else {
            el.style.display='none';
            el.value='';
        }
    }      
    function updateBooking(evt) {
        evt = evt || window.event;
        targ = evt.target || evt.srcElement;
        if (targ.nodeName !== 'INPUT') {
            return;
        }
        var passenger = document.getElementById('passenger');
        var passengerIndex = passenger.selectedIndex;
        var direction = targ.value.split(" to ");
        var origin = direction[0];
        var dest = direction[1];
        origin = (origin === 'Home') ? address[passengerIndex] : origin;
        dest = (dest === 'Home') ? address[passengerIndex] : dest;
        document.getElementById('from').value = origin;
        document.getElementById('goingto').value = dest;
        toggleFields(origin, dest);
    }
    document.getElementById('direction').onclick = updateBooking;
    
    
    (function () {
        var direction = document.getElementById('direction');
        var defaultRadio = document.getElementById('airportToHome');
        defaultRadio.click();
        direction.onclick = updateBooking;
        direction.onclick({target: defaultRadio});
    })();
    
    
    </script>
    the script is not interacting with my form as it should do (ie inputting the address field when a radio button is clicked and making form elements visible)

    can anyone see what is wrong??

  18. #18
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Select Case is a vbscript/asp thing, yet it's in your javascript

    Using "set" on an asp variable only works if you are referencing an object, not a simple data type.
    Code:
    <script>
    
    var address = <&#37;
    Select Case r("tbl.ID")
    	Case 53
    		%>['', 'this address', 'that address', 'another address']<%
    	Case 55
    		%>['', 'this address 2']<%
    	Case 57
    		%>['', 'a different address', 'yet another address']<%
    End Select
    %>;
    
    function toggleFields(origin, dest) {
        displayElement('fromairport', (origin === 'Airport'));
        displayElement('from', (origin !== 'Airport'));
        displayElement('toairport', (dest === 'Airport'));
        displayElement('goingto', (dest !== 'Airport'));
        displayElement('flightfrom', (origin === 'Airport'));
        displayElement('flightno', (origin === 'Airport'));
    }
    function displayElement(id, display) {
        var el = document.getElementById(id);
        if (display === true) {
            el.style.display = '';
        } else {
            el.style.display='none';
            el.value='';
        }
    }      
    function updateBooking(evt) {
        evt = evt || window.event;
        targ = evt.target || evt.srcElement;
        if (targ.nodeName !== 'INPUT') {
            return;
        }
        var passenger = document.getElementById('passenger');
        var passengerIndex = passenger.selectedIndex;
        var direction = targ.value.split(" to ");
        var origin = direction[0];
        var dest = direction[1];
        origin = (origin === 'Home') ? address[passengerIndex] : origin;
        dest = (dest === 'Home') ? address[passengerIndex] : dest;
        document.getElementById('from').value = origin;
        document.getElementById('goingto').value = dest;
        toggleFields(origin, dest);
    }
    document.getElementById('direction').onclick = updateBooking;
    
    
    (function () {
        var direction = document.getElementById('direction');
        var defaultRadio = document.getElementById('airportToHome');
        defaultRadio.click();
        direction.onclick = updateBooking;
        direction.onclick({target: defaultRadio});
    })();
    
    
    </script>

  19. #19
    SitePoint Evangelist
    Join Date
    Feb 2005
    Location
    London, UK
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    brilliant.

    thanks a lot


Bookmarks

Posting Permissions

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