asked on

Binding a cfinput type=text with a cfselect multiple=true

I am trying to update the value of a cfinput with the items selected in a cfselect multiple select box. Here is a code snippet of the cfinput and cfselect tags:

<cfinput
	type="text" 
name="keywords" 
	bind="{keyword.value}"
	length="25" 
	onFocus="javascript:if(CFForm_1.hidden_keywords.value==''){this.value=''}"
	onBlur="javascript:CFForm_1.hidden_keywords.value=this.value; " 
    	tootip="Associate keywords with this resource." >
</cfinput>
<cfinput name="hidden_keywords" type="hidden" value="">
						
<cfset THIS.dsn="OPA_REPRO">

<cfquery datasource="#THIS.dsn#" name="get_keyword_list">
							SELECT keywrd_id, keywrd
	FROM repro_keywrd
	ORDER BY keywrd
</cfquery>
<cfselect 
	query="get_keyword_list"
	value="keywrd_id"
	id="keyword"
	display="keywrd"
	name="keyword" 
	title="Keyword" 
	required="false"
	multiple="yes"
	size="25">
</cfselect>

Open in new window

I keep getting the following message:

Bind failed, element not found: keyword

What am I not seeing? Isn't this a correct bind expression? I thought this would be simple. But, six hours later I still can't figure out what is causing the bind to fail. Help! CF8 by the way.

_agx_

As stupid as this sounds, try putting the text box after the select list.

jfendley

ASKER

Tried that, and on your request tried again. But, that doesn't resolve the issue. Bind still fails regardless of whether the CFINPUT is before or after the CFSELECT. I really thought this simple bind would work. But, it's really mucked up.

_agx_

Weird ... I got the same error as you w/CF9. Then moved the elements. Now I just tried it again, with the original code, and it works fine. Odd ...

_agx_

Ooops .. posts clashed.

There's nothing wrong with your code from what I can see. IMO it should work as is.

Let me try restarting and see if I can get back that original error.

jfendley

ASKER

I just want the CFINPUT to be populated with the values selected in the CFSELECT.

I'd like the CFSELECT to be in a CFWINDOW. But, if this simple bind wont work, I'm not sure I want to try binding the CFINPUT to a CFSELECT in a CFWINDOW.

_agx_

Our posts keep clashing....

I understand. But what I'm saying is there isn't any reason your code shouldn't work. You could re-write it with a bind="javascript:functionName(...)". If you want to explore that option let me know. But you're right to think what you have should work "as is".

jfendley

ASKER

That's disheartining. If it should work as is but doesn't, that means I have to program a work around for a feature that should work. Arrrgh.

Wouldn't happen to have a sample of code for that bind="javascript:functionName(..)" for this functionality would ya?

I was hoping to just have to add a @change to the bind to get the CFINPUT to update everytime a value in the CFSELECT was selected/deselected.

_agx_

Well javascript errors happen occasionally. With all the sites out there using jquery I see it all the time. Anyway ..

A) Are you sure you're getting this error every time and aren't just looking at a cached page? Also what browser?
B) Is that the exact code you're using?

Because I re-tried it under CF9 and CF8 and both are working fine. I can't reproduce the error even after restarting.

<cfset get_keyword_list = queryNew("")>
<cfset queryAddColumn(get_keyword_list, "keywrd_id", listToArray("1,2,3"))>
<cfset queryAddColumn(get_keyword_list, "keywrd", listToArray("A,B,C"))>


<cfform>
<cfinput
	type="text" 
        name="keywords" 
	bind="{keyword.value}">
						
<cfselect 
	query="get_keyword_list"
	value="keywrd_id"
	id="keyword"
	display="keywrd"
	name="keyword" 
	title="Keyword" 
	required="false"
	multiple="yes"
	size="5">
</cfselect>
</cfform>

Open in new window

jfendley

ASKER

Interesting and wierd. Your code works when I insert it into the current page.

However, the existing code is between <cfform></cfform> tags. Your code was placed into the code with it's cfform tags intact and the bind works. But, when I remove your cfform tags to allow the code to flow within my existing cfform tags I get the bind error again.

Thoughts?

_agx_

Can you post the entire code you're using? Maybe there's something else in the form causing problems.

_agx_

> Your code was placed into the code with it's cfform tags intact and the bind works.

Well obviously it was intended to be a stand alone example ;) I'm kindof surprised that even worked .. since nesting <form> tags isn't legal html.

ASKER CERTIFIED SOLUTION

jfendley

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

_agx_

Lol, since there were no <table>'s in the code posted, I wouldn't have come up with that one. For next time, be sure to post the actual code causing the problem. It'll help cut to the chase quicker ;-)

Glad you solved it. You should post a small example the bad vs fixed nesting and accept your comment as the answer.

jfendley

ASKER

I accepted my on comment as the solution because that's what worked.