Coast Line
asked on
cfselect ajax binding
I am working on a very old page which usually when i use something else from drop, it just reloads the whole Page, it does call any CFC, it just refreshes the same page and some variables are set in the main file like session or something and then whole page reloads, and the content appears on the page again
i have the following code on the cfselect
onChange = 'window.location=?action=g o&c=#ID#' + '&catID=' + SelectedValue of the Select box, it submits to itself..
what i am trying here is bind the cfselect to the same page but it should not reload the data but it should make some kind of ajax call so it should all the variables which are being set on page reload again and load the data of that particluar chosen cfselect inthe cfdiv if possible
Guide me how can i procedd
i have the following code on the cfselect
onChange = 'window.location=?action=g
what i am trying here is bind the cfselect to the same page but it should not reload the data but it should make some kind of ajax call so it should all the variables which are being set on page reload again and load the data of that particluar chosen cfselect inthe cfdiv if possible
Guide me how can i procedd
Do you think you can post a code ?
You can load the the updates to <cfdiv> or <cfwindow> or <cfpod>
You can load the the updates to <cfdiv> or <cfwindow> or <cfpod>
Here is simulated test code for you.
<!--- CFPAGE1.CFM --->
<h1>THIS ISCFPOD</h1>
<cfwindow source="url:getMoreDetails .cfm?id={s el1}" center="true" initshow="true" closable="true" width="400" height="400" />
<h1>INCLUDE CFPAGE2.CFM</h1>
<cfinclude template="cfpage2.cfm" >
<!--- CFPAGE2.CFM --->
<h1>INCLUDE SELECT</h1>
<cfinclude template="cfselect.cfm">
<h1>CFDIV, you can do bindonload=false</h1>
<cfdiv bindonload="false" id="details" bind="url:getMoreDetails.c fm?id={sel 1}"></cfdi v>
<!--- getMoreDetails.cfm ---->
<cfif #isdefined('url.id')#>
<h1>HERE ARE THE MORE DETAILS FOR <cfoutput>#url.id#</cfoutp ut></h1>
<cfset variables.id=#url.id#/>
<cfscript>
qryData=querynew ("id,optionvalue,optiondis play,detai ls","Integ er,Varchar ,Varchar,V arChar");
for (ix=0; ix < 10; ix++) {
t=queryaddrow(qryData);
t=querySetCell(qryData,"id ",ix);
t=querySetCell(qryData,"op tionvalue" , "value" & ix);
t=querySetCell(qryData,"op tiondispla y", "Option " & ix);
t=querySetCell(qryData,"de tails", "Details for Option " & ix);
}
</cfscript>
<cfquery dbtype="query" name="detqry">
select id,optionvalue, details,optiondisplay
from qryData
where optionvalue='#variables.id #'
</cfquery>
<cfdump var="#detqry#"/>
</cfif>
<!--- CFPAGE1.CFM --->
<h1>THIS ISCFPOD</h1>
<cfwindow source="url:getMoreDetails
<h1>INCLUDE CFPAGE2.CFM</h1>
<cfinclude template="cfpage2.cfm" >
<!--- CFPAGE2.CFM --->
<h1>INCLUDE SELECT</h1>
<cfinclude template="cfselect.cfm">
<h1>CFDIV, you can do bindonload=false</h1>
<cfdiv bindonload="false" id="details" bind="url:getMoreDetails.c
<!--- getMoreDetails.cfm ---->
<cfif #isdefined('url.id')#>
<h1>HERE ARE THE MORE DETAILS FOR <cfoutput>#url.id#</cfoutp
<cfset variables.id=#url.id#/>
<cfscript>
qryData=querynew ("id,optionvalue,optiondis
for (ix=0; ix < 10; ix++) {
t=queryaddrow(qryData);
t=querySetCell(qryData,"id
t=querySetCell(qryData,"op
t=querySetCell(qryData,"op
t=querySetCell(qryData,"de
}
</cfscript>
<cfquery dbtype="query" name="detqry">
select id,optionvalue, details,optiondisplay
from qryData
where optionvalue='#variables.id
</cfquery>
<cfdump var="#detqry#"/>
</cfif>
ASKER
Thanks! But where is the select statements bind or do i need to bind it or where, the example seems bit confusing to me
my cfselect.cfm is as follows. Sorry I forgot to post the code.
<cfform name="form1">
<cfselect name="sel1">
<option value="0">Option 0</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 4</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
<option value="7">Option 7</option>
<option value="8">Option 8</option>
<option value="9">Option 9</option>
</cfselect>
</cfform>
CFSELECT can be bound to query. It does not matter.
Important thing to note here is how to bind the selected value to other cf ajax tags (cfwindow, cfdiv)
<cfform name="form1">
<cfselect name="sel1">
<option value="0">Option 0</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 4</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
<option value="7">Option 7</option>
<option value="8">Option 8</option>
<option value="9">Option 9</option>
</cfselect>
</cfform>
CFSELECT can be bound to query. It does not matter.
Important thing to note here is how to bind the selected value to other cf ajax tags (cfwindow, cfdiv)
ASKER
yeah now what next?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
ok i got ur point send to cfwindow
but the thing is previously it is reloading the whole page, and now i will be navigating to cfwindow, and then how will i transfer value from the cfwindow to the main page wth cfdiv or something else
let me knw
but the thing is previously it is reloading the whole page, and now i will be navigating to cfwindow, and then how will i transfer value from the cfwindow to the main page wth cfdiv or something else
let me knw
For this is happen, you can always do
1. bind the field(s) on the main page to fields on the cfwindow/cfdiv.
2. It is possible to run some custom javascript functions also.
Question you posted initially does not talk about this requirement.
Can you please explain in need ?
1. bind the field(s) on the main page to fields on the cfwindow/cfdiv.
2. It is possible to run some custom javascript functions also.
Question you posted initially does not talk about this requirement.
Can you please explain in need ?
ASKER
Although Partially it has been abondoned, due to its no usage, But still i would learn how to do, currently i am selecting the answer, but i may ask the question again
ASKER
I am here to say, how can i do this Ajax Coldfusion
1. I have a Main Page Index.cfm
2. Inside the inside there is anotehr Page - refreshLoads.cfm
3. Inside the refreshLoads - There is another Included Page which is Select.cfm
Now in 3 i have the cfselect which pulls out the roles from the database to populate. The whole core Lgic of queries and all is written in the refreshLodads.cfm Page
What currently is happening is, it reloads the whole page when i select another so probaby it reload the index.cfm page which automatically loads internal pages. my concern here if i choose a role, i just want to reload the specific part written inside the refreshLoads.cfm page which just populates the Tables with new Roles and New things