Solved

Show/Hide Div AND pass value of the select box to a query...

Posted on 2010-09-08
8
471 Views
Last Modified: 2012-05-10
In short I want to pass the value of what is selected from this select box

<cfform name="myform" method="post" action="dsp_userAdmin.cfm"> 
<select name="SelectedUserID" onChange="submit();">
    <option value="">Please Select</option>
    <cfloop query="session.qry_getUsers">
    <option value="#id#" <cfif selectedUserID eq id>selected</cfif>>#displayName#</option>
    </cfloop>
</select>
</cfform>  
 

Open in new window


to a div that only appears when something is selected. So I need to change the style to not hidden and I need to use that variable #selectedUserID# in a cfif statement and then query.

<cfdiv id="thisDiv" style="hidden><cfif selectedUserID neq '''><cfinclude template=""></cfif></cfdiv>

Open in new window


I've tried various things with cflayout and it just keeps giving me issues (HOW DO YOU USE CFDEBUG!? <- that's another rant!). Anyway, any and all help would be appreciated. I don't want to refresh this page.... it's got too much other info on it.

Where I can
partial code of form 

<cfform name="myform" method="post" action="dsp_userAdmin.cfm"> 
<select name="SelectedUserID" onChange="submit();">
    <option value="">Please Select</option>
    <cfloop query="session.qry_getUsers">
    <option value="#id#" <cfif selectedUserID eq id>selected</cfif>>#displayName#</option>
    </cfloop>
</select>
</cfform>  
  
<cfdiv id="thisDiv" style="hidden><cfif selectedUserID neq '''><cfinclude template=""></cfif></cfdiv>

Open in new window

0
Comment
Question by:traport
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
8 Comments
 
LVL 53

Expert Comment

by:Huseyin KAHRAMAN
ID: 33627674
implement this
<script>
function showID(v){
var d = document.getElementById("thisDiv");
d.style.display = (v != "") ? "" : "none";
d.innerHTML = v;
}
</script>

<select name="SelectedUserID" onChange="showID(this.value)">
    <option value="">Please Select</option>
    <option value="HK">Hain</option>
    <option value="HainKurt">Kurt</option>
</select>

<div id="thisDiv" style="display:none"></div>

Open in new window

0
 

Author Comment

by:traport
ID: 33627820
Thanks HainKurt.

This works... except how can I do anything with the variable #selectedUserID#. It displays in the div, but I want to use it in a query...

select * from table where id = #selectedUserID#

I need it as a variable if that makes sense.
0
 
LVL 53

Expert Comment

by:Huseyin KAHRAMAN
ID: 33629229
if you post the form, you will get the selected user with request object

and you get it from cf like this I guess

context.Request.Form["selectedUserID"]
0
Creating Instructional Tutorials  

For Any Use & On Any Platform

Contextual Guidance at the moment of need helps your employees/users adopt software o& achieve even the most complex tasks instantly. Boost knowledge retention, software adoption & employee engagement with easy solution.

 

Author Comment

by:traport
ID: 33629625
I just don't know how to put to use what you're suggesting. I'm pretty remedial! :) Thanks for trying.
0
 
LVL 53

Accepted Solution

by:
Huseyin KAHRAMAN earned 500 total points
ID: 33629815
post the code where your query is

select * from table where id = #selectedUserID#

you need to modify it like

select * from table where id = context.Request.Form["selectedUserID"]
0
 

Author Comment

by:traport
ID: 33629901
Thank you; I'll give it a shot as soon as I get back in the office!
0
 

Author Comment

by:traport
ID: 33630416
I keep getting errors that "context" is undefined.  Here's what I tried to do with your suggestion:


cfparam name="userID" default="">
<script>
function showID(v){
var d = document.getElementById("thisDiv");
d.style.display = (v != "") ? "" : "none";
d.innerHTML = v;
}
</script>
<form>
<select name="SelectedUserID" onChange="showID(this.value);">
    <option value="">Please Select</option>
    <option value="HK">Hain</option>
    <option value="HainKurt">Kurt</option>
</select>
</form>

<div id="thisDiv" style="display:none"><cfset userID eq context.Request.Form["selectedUserID"]><cfoutput>#userID#</cfoutput></div>

Open in new window

0
 

Author Comment

by:traport
ID: 33632115
I had to go another way entirely with this... I used iframes but I wanted to give you the points for sticking with me. Thanks!


<script>
function showUser() {
	var foodd = document.getElementById("selectedUserID");
	var foovalue = foodd.options[foodd.selectedIndex].value;
	if(!foovalue) return;
	var myframe = document.getElementById("myiframe");
	myframe.src = "dsp_userForm.cfm?selectedUserID="+foovalue;
}
</script>
<cfoutput><br>
<select id="selectedUserID" onChange="showUser()">
   		<option value="">Please Select</option>
            <cfloop query="session.qry_getUsers">
    		<option value="#id#" <cfif selectedUserID eq id>selected</cfif>>#displayName#</option>
  			</cfloop>
</select>
</cfoutput>
<br>

<iframe id="myiframe" src="dsp_userForm.cfm" width="75%" height="100%" marginwidth="0" marginheight="0" frameborder="no" scrolling="yes">

Open in new window

0

Featured Post

MIM Survival Guide for Service Desk Managers

Major incidents can send mastered service desk processes into disorder. Systems and tools produce the data needed to resolve these incidents, but your challenge is getting that information to the right people fast. Check out the Survival Guide and begin bringing order to chaos.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
ckeditor not working on textarea created by javascript function 5 47
Mura 7 - Displaying the Page Summary 1 40
Check if field exists SPUtility 5 47
Attendance Tracking 3 24
Sometimes databases have MILLIONS of records and we need a way to quickly query that table to return the results me need. Sure you could use CFQUERY but it takes too long when there are millions of records. That is why SOLR was invented. Please …
OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question