My application needs to populate html selects with options from custom queries. I was trying to put the logic into a generic custom tag to do this so that my view is cleaner and more readable. I'm new to cfml.
Here is my code:
<!--- ```````````````````````````````````````````````````````````````````````````` --->
<!--- This tag will populate any SELECT with the OPTIONs pulled from the database. --->
<!--- The attributes of this tag are --->
<!--- data_source: The datasource for the query --->
<!--- table_source: The table used for the query --->
<!--- option_value_source: The DB cell to use for the value of the option. --->
<!--- option_inner_source: The DB cell to use for the value of the inner text. --->
<!--- ____________________________________________________________________________ --->
<cfquery name="option_query" datasource="#Attributes.data_source#">
SELECT * FROM #Attributes.table_source#
</cfquery>
<cfoutput query="option_query">
<option value="#Attributes.option_value_source#"> <!--- The cell to be used for the value of the option --->
#Attributes.option_inner_source# <!--- The cell to be used for the inner text of the option --->
</option>
</cfoutput>
I'm calling that with:
<label>
Class Name
<select name="className" id="className">
<cf_getOptions data_source="codify" table_source="classes" option_value_source="classes.id" option_inner_source="classes.name">
</select>
</label>
The result is that I get a SELECT populated with the word class.name for each result.
What is the most cfml way to do this (I assume people wouldn't normally use custom tags for this)? Is it possible to rewrite this code to get the correct result?
You're close (and good on you for using custom tags, btw).
You need to tell CF you want the column value from the query, not just the value of the passed-in attribute. So it'd be this:
<cfoutput query="option_query">
<option value="#option_query[Attributes.option_value_source][currentRow]#">
#option_query[Attributes.option_inner_source][currentRow]#
</option>
</cfoutput>
One can only use a direct reference to a column name the way you originally had, but you need an indirect reference here, which means the code gets a bit more cumbersome.
Related
I need a select option in angular 4, but data binding doesn´t work.
I have a function "ChangeTable" in (ngModelchange) but the parameter always that i send in the function is "undefined".
I have tried to went $event.target.value but it also go "undefined"
this is my code html
<select [(ngModel)]="selectTable" (ngModelChange)="ChangeTable($event)" >
<option>Select item</option>
<option *ngFor="let table of tables" [value]="table.id">
{{table.Description}}
</option>
</select>
this is my code in component
ChangeTable(ev:any){
var tabla=this.selectTabla;
}
You can help me, please.thanks
ngModelChange itself extracts the value from $event so you no more need to do $event.target.value. In your case there must be no id exist in table object that's may be the reason you are getting undefined whenever your binding value property with table's id([value]=table.id).
Check your table's data once and you can also refer this stackblitz link where I've demonstrated your use-case.
I'm very very new to jsp and postgresql and I want to add a dropdown menu to my jsp file.
There is table with Names and Numbers and all I want is getting the names displayed in the drop down
This is what I got so far. An empty dropdown with the right numbers of rows (4 as I have only for rows in my table) is displayed but no names!
<sql:query
dataSource="${db}"
var="result">
select name from customer
</sql:query>
<select>
<c:forEach
var="result"
items="${result.rows}">
<option value=${param.name}>${param.name}
</option>
</c:forEach>
</select>
Thanks for any help in advance!
PS: i tried to find an answer but all the answers were about mysql but we are using psql :/
Your option list has the right number or options but they're empty because the variable param doesn't exist.
You have:
<c:forEach var="result" items="${result.rows}">
<option value=${param.name}>${param.name}</option>
</c:forEach>
var is the variable to be created from items, so you don't want it named the same as the items list. This is where you should be creating the variable param. It should be:
<c:forEach var="param" items="${result.rows}">
<option value='<c:out value="${param.name}"/>'><c:out value="${param.name}"/></option>
</c:forEach>
You should probably also do it like <option value='${param.name}'> since the field name is probably text rather than numeric.
I have a form the needs to be populated and and updated. There are several dropdown fields and input fields on the form that need to be populated and then allow the user to make a change if necessary. I have created queries to select the data, then I want to populate the form with the selected data but, allow a user to change the form fields. I have tried with the first field which is a dropdown field but, I receive an error saying that I can't nest two queries.
This is the error I received: A query driven cfoutput tag is nested inside a cfoutput tag that also has a query attribute. This is not allowed. Nesting these tags implies that you want to use grouped processing. However, only the top-level tag can specify the query that drives the processing.
Here is my code:
<cfoutput query="getinfo">
<select name="ProgramName" id="ProgramName" style= "font-size:24px">
<option style="font-size:24px" value = "0">--Program Name--</option>
<cfloop query="PName">
<option value="#ProgramName#">#ProgramName#</option>
</cfloop>
</select>
</cfoutput>
Here is my getinfo query:
<cfquery name="getinfo" datasource="dbotest">
SELECT ProgramName, TestName
FROM Programs
WHERE ProgramID = "D219"
</cfquery>
What you've posted is valid syntax for outputting a query.
<cfoutput query="getinfo">
<select name="ProgramName" id="ProgramName" style= "font-size:24px">
<option style="font-size:24px" value = "0">--Program Name--</option>
<cfloop query="PName">
<option value="#ProgramName#">#ProgramName#</option>
</cfloop>
</select>
</cfoutput>
If your page is set up like this, then that is invalid. You can simply change <cfoutput query="getinfo"> to be <cfloop query="getinfo">
<cfoutput>
<!--- other code --->
<cfloop query="getinfo">
<select name="ProgramName" id="ProgramName" style= "font-size:24px">
<option style="font-size:24px" value = "0">--Program Name--</option>
<cfloop query="PName">
<option value="#ProgramName#">#ProgramName#</option>
</cfloop>
</select>
</cfloop>
<!--- more code --->
</cfoutput>
(I know this isn't really an answer but should hopefully help clear things up.)
So I'm trying to submit a page to itself while retaining the current query string of the page.
So the page is sb.local/sb/cat.php?brandcode=JM&t=cat_items I pull off the query string and stick it back into the html form to preserve the parameters. This is the resulting form:
<form id="brand-select" method="get" action="?brandcode=JM&t=cat_items" name="brand-select">
Brand:
<select id="brandcode" style="width:207px" tabindex="3" name="brandcode" required="">
<option value=""></option>
<option class="brand-option" value="AX" data-brandid="110"> Aetrex </option>
<option class="brand-option" value="AL" data-brandid="12"> Alden </option>
<option class="brand-option" value="ETC" data-brandid="11"> Etc </option>
</select>
<input type="submit" value="go">
</form>
When I submit the form by choosing the dropdown for Aetrex (value AX), however, it goes to a url of:
sb.local/sb/cat.php?brandcode=AX
in other words, it cuts out the "t=cat_items" that is in the action. It also cuts out the "brandcode=JM" but I would almost expect that since they're duplicates.
That's not what I expected, I expected that if there is a query string in the action attribute, it would append form values to that query string (e.g. sb.local/sb/cat.php?brandcode=JM&t=cat_items&brandcode=AX. Instead it seems to be replacing the query string entirely with only those elements that are in the form.
Is the form action attribute not usable for storing query parameters, only more basic url info?
Edit: Note that I can work around this by parsing every parameter and then putting each parameter into its own hidden field manually, except for any parameters that I want to allow to change, I was just hoping that there was some kind of simpler way.
I tested with a non-conflicting query string and that was replaced in whole even when there wasn't a conflict (in Firefox), so based on that it seems that query strings are useless in the action attribute of get forms? Or am I missing something.
I know this is an old question, but the solution is actually pretty simple (and neat!).
All you have to do is sending the querystring with hidden input fields in the format name="key" and value="value".
?brandcode=JM&t=cat_items would "translate" into:
<input type="hidden" name="brandcode" value="JM" />
<input type="hidden" name="t" value="cat_items" />
Completely remove the querystring from your action.
Change your code to:
<div>
<form action="?brandcode=&t=" method="get">
....
</form>
You can use "POST" method instead of "GET" method for form submission, if the method doesn't matter.
I have taken over a legacy site, and my spidey sense code smell is going crazy over the form paramming used throughout the site.
For example we have a form that allows you to add a new contact, or edit an existing one dependant on the iContactId being present in the URL. So the code in the top part of the cfm file is.
<cfparam name="form.name" default="">
<cfparam name="form.age" default="">
<cfparam name="form.surname" default="">
<--- More cfparams for every form field--->
<cfif isDefined("URL.iContactId")>
<cfset VARIABLES.contact = contactService.getContact("URL.iContactId")/>
<cfset FORM.name = contact.getName() />
<cfset FORM.age= contact.getAge() />
<cfset FORM.surname = contact.getSurname() />
</cfif>
So essentially we are defaulting all form fields to be empty and then populating them if the iContactId is in the URL. The form at the bottom part of the cfm file uses these variables like this.
<form>
<input name="name" value="#FORM.name#">
Now, for me, the issue with these technique, is that there are around 30 form fields on this page, so I am parramming all form fields, and then setting 30 form fields to the contact objects values if the URL.iContactId variable exists. Am trying to think of a way to remove this duplication - maybe by mapping the form directly to the object?
Any ideas?
Thanks
Don't see why not.
Get getContact() to return an "empty" object for contact ID 0 and populate the form from the empty contact object. By "empty" I mean an object with default values set for each field.
eg.
if (!StructKeyExists(URL,"iContactID")) URL.iContactID = 0;
variables.contact = contactService.getContact(URL.iContactID);
and then in the form.
<input name="name" value="#contact.getName()#">
Only thing to be aware of; If you are doing server-side validation that returns you to this form then you will need to manage making sure that you have a contact object with the valid data in it to populate your form, so that the invalid fields can be corrected.