HOW TO -REG DYNAMIC DROPDOWN BOX.(FIX MY CODE)

kaniths · December 21st, 2006, 01:31 AM

<div align="left">
hey frends..
i had to create a asp page with 2 select pulldowns(state,city),options to b displayed in the CITY depends on STATE choice.

the option list is to retrived from a db "dynamically".

i have a table with fields--state,stateID,city,cityID.

here is the code snippet i have..it works fine!! but....

Code:

<html>
<head>
<title>testpage</title>
<script language=javascript >
var States = new Array();
var Cities = new Array();

function addState(state) {

    v1 = States.length;
   States.length ++;
   States[v1] = state;
   v1 = Cities.length;
   Cities.length ++;
   Cities[state] = new Array();
}

function addCity(state,city) {
      v1 = Cities[state].length;

    Cities[state].length ++;

    Cities[state][v1] = city;
}

function loadStateList() {

    var ctrlState = document.frmAddress.State;
    ctrlState.options.length = 0;
    for (i=0;i<States.length;i++) {
    ctrlState.options[i] = new Option(States[i],States[i]);
    }
}

function loadCityList() {

    var ctrlState = document.frmAddress.State;
    var selState = ctrlState.options[ctrlState.selectedIndex].value;

    var ctrlCity = document.frmAddress.City;
    ctrlCity.options.length = 0;

    for (i=0;i<Cities[selState].length;i++) {
        ctrlCity.options[i] = new Option(Cities[selState][i]);
    }
}
</script>

</head>
<body onload="loadStateList();loadCityList();">

<%
' Open Database and setup a recordset with States Listed.
set conn = server.createobject("ADODB.Connection")
Conn.open("driver={SQL Server};server=xxxxxxx;uid=xxxxxxx;pwd=xxxxxxx;database=xxxxxxx;network=dbmssocn")
strSQL = "Select State, city from tbAddress Order by State,city"
set rs = conn.execute(strSQL)


if rs.eof then
    response.write("No Addresses Found")
    rs.close
    set rs=nothing
    response.end
end if

strState = ""
strCity = ""
do until rs.eof
    if not rs("State") = strState then
        response.write("<script>addState('" & rs("State") & "')</script>")
        response.write("<script>addCity('" & rs("State") & "','" & rs("City") & "')</script>")
        strState = rs("State")
        strCity = rs("City")
    else
        if not rs("City") = strCity then
            response.write("<script>addCity('" & rs("State") & "','" & rs("City") & "')</script>")
            strCity = rs("City")
        end if
    end if
    rs.MoveNext
loop
rs.close
set rs=nothing
%>


<form name="frmAddress" method="POST" action="">
    <table>
        <tr>
            <td>STATE ID:</td>
            <td><input type=text hidden="true" name="text1" /></td>
        </tr>
        <tr>
            <td>CITY ID</td>
            <td><input type=text hidden="true" name="text2" /></td>
        </tr>
        <tr>
            <td>State</td>
            <td>
                <select size="1" name="State" onChange="loadCityList();">
                </select>
            </td>
        </tr>
        <tr>
            <td>City</td>
            <td>
                <select size="1" name="City">
                </select>
            </td>
        </tr>
        </table>
    <p>
    <input type="submit" value="Submit" name="save" />
    <input type="reset" value="Reset" name="clear" />
    </p>
</form>
</body>
</div id="left">
</html>

NOW..how can i modify the code,so that wen the option is selected in the STATE & CITY lists,simulteneously the stateID,cityID are filled in 2 hidden textboxes,Text1 & Text2..

kindly help..
thanks..

regards,
kanith:)

Greg Griffiths · December 21st, 2006, 05:56 PM

probably the best thing to do is to add a Javascript to run when the form is submitted that will populate the values for you prior to form submission.

function popFields()
{
    // get the values
    var state=document.frmAddress.State.options[document.frmAddress.State.selectedIndex].value;
    var city=document.frmAddress.City.options[document.frmAddress.City.selectedIndex].value;

    // populate the values
    document.frmAddress.text1=state;
    document.frmAddress.text2=city;

    // submit the form
    return true;
}

then simply change the FORM tag to the following :

<form name="frmAddress" method="POST" action="" onsubmit="return popFields()">

see http://www.htmlcodetutorial.com/form..._onSubmit.html for another example.

kaniths · December 21st, 2006, 08:44 PM

Hi..Thanx really..this idea dint strike 2me..
but tht doesn help 2 get wat i want..

DB FIELDS::: STATE|STATE_ID|CITY|CITY_ID

In my code,only the STATE & CITY values are used/passed..HOW CAN I put some code that ll retrive the STATE_ID n CITY_ID values too,n place it in textboxes,Depending on the STATE & CITY choices respectively..

kindly help.
regards,
kanith

regards,
kanith