Re: Javascript not working inside of cflayoutarea
Got it now. Thanks guys for all of the help.
I really appreciate it.
-Steve
1) in your main page change this:
$(document).ready(function() {
$(#accordion).accordion();
});
to this:
doAccordion = function() { $(#accordion).accordion(); });
2) make html code in your test.cfm standards-compliant (add doctype,
html, head, body, etc tags) and then add this as the last line before
the closing /body tag:
cfset ajaxonload('doAccordion')
Azadi
On 13/04/2011 11:09 , Steve Sequenzia wrote:
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343696
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
Re: Javascript not working inside of cflayoutarea
Thanks guys. Any idea how to make this jquery work in cflayout?
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
titleMAMBA - Martial Arts Management Business Automation/title
link href=style.css rel=stylesheet type=text/css /
link
href=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css;
rel=stylesheet type=text/css/
script
src=http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js;/script
script
src=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js;/script
script
$(document).ready(function() {
$(#accordion).accordion();
});
/script
/head
body
cfajaximport tags=cflayout-accordion, cfdiv, cfpod, cfinput-autosuggest,
cfwindow, cfform, cfgrid, cflayout-border, cftree, cfinput-datefield
cflayout type=border fittowindow=yes
cflayoutarea name=top position=top style=background:##414144;
height:90px; source=top.cfm/cflayoutarea
cflayoutarea name=left position=left style=width:200px;
splitter=false collapsible=false source=test.cfm/cflayoutarea
cflayoutarea name=main position=center style=background:##E8E8E8;
height:100%; source=main.cfm/cflayoutarea
/cflayout
/body
/html
Test.cfm
div id=accordion
h3a href=#Section 1/a/h3
div
p
/p
/div
h3a href=#Section 2/a/h3
div
p
/p
/div
h3a href=#Section 3/a/h3
div
p
/p
ul
liList item one/li
liList item two/li
liList item three/li
/ul
/div
/div
Steve
cfajaximport scriptsrc=... is only for cf's built-in scripts - you
do not use it to load anything else. and you only need to use it if you
do not have access to default cf's scripts folder or if you have moved
the default cf scripts to another folder.
to load jquery or any other js scripts, you just use your regular
script tags in the head section of your page.
specifically for dealing with scripts in pages loaded into cf's ajax
containers i found this approach working best:
- include your js library (jquery) in the main page (the one that has
cflayout tags in you case)
- include any js code that needs to run after pages have been loaded
into ajax containers as separate js functions in the main page's head
section as well.
- in the pages loaded inside ajax containers add cfset
ajaxonload('name-of-your-js-function-to-execute-here') as the last line
before the closing /body tag: this will run the specified js function
after the page has been loaded inside the container
Azadi
On 11/04/2011 22:31 , Steve Sequenzia wrote:
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343690
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
RE: Javascript not working inside of cflayoutarea
Put this
script
$(document).ready(function() {
$(#accordion).accordion();
});
/script
Inside your test.cfm and leave the rest where it is.
Regards,
Andrew Scott
http://www.andyscott.id.au/
-Original Message-
From: Steve Sequenzia [mailto:c...@thinksys.com]
Sent: Wednesday, 13 April 2011 1:09 PM
To: cf-talk
Subject: Re: Javascript not working inside of cflayoutarea
Thanks guys. Any idea how to make this jquery work in cflayout?
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
titleMAMBA - Martial Arts Management Business Automation/title
link href=style.css rel=stylesheet type=text/css /
link
href=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jque
ry-ui.css rel=stylesheet type=text/css/
script
src=http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js;/scrip
t
script src=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-
ui.min.js/script
script
$(document).ready(function() {
$(#accordion).accordion();
});
/script
/head
body
cfajaximport tags=cflayout-accordion, cfdiv, cfpod, cfinput-autosuggest,
cfwindow, cfform, cfgrid, cflayout-border, cftree, cfinput-datefield
cflayout type=border fittowindow=yes
cflayoutarea name=top position=top
style=background:##414144; height:90px;
source=top.cfm/cflayoutarea
cflayoutarea name=left position=left style=width:200px;
splitter=false collapsible=false source=test.cfm/cflayoutarea
cflayoutarea name=main position=center
style=background:##E8E8E8; height:100%;
source=main.cfm/cflayoutarea
/cflayout
/body
/html
Test.cfm
div id=accordion
h3a href=#Section 1/a/h3
div
p
/p
/div
h3a href=#Section 2/a/h3
div
p
/p
/div
h3a href=#Section 3/a/h3
div
p
/p
ul
liList item one/li
liList item two/li
liList item three/li
/ul
/div
/div
Steve
cfajaximport scriptsrc=... is only for cf's built-in scripts - you
do not use it to load anything else. and you only need to use it if you
do not have access to default cf's scripts folder or if you have moved
the default cf scripts to another folder.
to load jquery or any other js scripts, you just use your regular
script tags in the head section of your page.
specifically for dealing with scripts in pages loaded into cf's ajax
containers i found this approach working best:
- include your js library (jquery) in the main page (the one that has
cflayout tags in you case)
- include any js code that needs to run after pages have been loaded
into ajax containers as separate js functions in the main page's head
section as well.
- in the pages loaded inside ajax containers add cfset
ajaxonload('name-of-your-js-function-to-execute-here') as the last
line before the closing /body tag: this will run the specified js
function after the page has been loaded inside the container
Azadi
On 11/04/2011 22:31 , Steve Sequenzia wrote:
~~
~~~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-
Anthology/dp/1430272155/?tag=houseoffusion
Archive: http://www.houseoffusion.com/groups/cf-
talk/message.cfm/messageid:343690
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-
talk/unsubscribe.cfm
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343691
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
Re: Javascript not working inside of cflayoutarea
1) in your main page change this:
$(document).ready(function() {
$(#accordion).accordion();
});
to this:
doAccordion = function() { $(#accordion).accordion(); });
2) make html code in your test.cfm standards-compliant (add doctype,
html, head, body, etc tags) and then add this as the last line before
the closing /body tag:
cfset ajaxonload('doAccordion')
Azadi
On 13/04/2011 11:09 , Steve Sequenzia wrote:
Thanks guys. Any idea how to make this jquery work in cflayout?
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
titleMAMBA - Martial Arts Management Business Automation/title
link href=style.css rel=stylesheet type=text/css /
link
href=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css;
rel=stylesheet type=text/css/
script
src=http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js;/script
script
src=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js;/script
script
$(document).ready(function() {
$(#accordion).accordion();
});
/script
/head
body
cfajaximport tags=cflayout-accordion, cfdiv, cfpod, cfinput-autosuggest,
cfwindow, cfform, cfgrid, cflayout-border, cftree, cfinput-datefield
cflayout type=border fittowindow=yes
cflayoutarea name=top position=top style=background:##414144;
height:90px; source=top.cfm/cflayoutarea
cflayoutarea name=left position=left style=width:200px;
splitter=false collapsible=false source=test.cfm/cflayoutarea
cflayoutarea name=main position=center style=background:##E8E8E8;
height:100%; source=main.cfm/cflayoutarea
/cflayout
/body
/html
Test.cfm
div id=accordion
h3a href=#Section 1/a/h3
div
p
/p
/div
h3a href=#Section 2/a/h3
div
p
/p
/div
h3a href=#Section 3/a/h3
div
p
/p
ul
liList item one/li
liList item two/li
liList item three/li
/ul
/div
/div
Steve
cfajaximport scriptsrc=... is only for cf's built-in scripts - you
do not use it to load anything else. and you only need to use it if you
do not have access to default cf's scripts folder or if you have moved
the default cf scripts to another folder.
to load jquery or any other js scripts, you just use your regular
script tags in thehead section of your page.
specifically for dealing with scripts in pages loaded into cf's ajax
containers i found this approach working best:
- include your js library (jquery) in the main page (the one that has
cflayout tags in you case)
- include any js code that needs to run after pages have been loaded
into ajax containers as separate js functions in the main page'shead
section as well.
- in the pages loaded inside ajax containers addcfset
ajaxonload('name-of-your-js-function-to-execute-here') as the last line
before the closing/body tag: this will run the specified js function
after the page has been loaded inside the container
Azadi
On 11/04/2011 22:31 , Steve Sequenzia wrote:
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343692
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
RE: Javascript not working inside of cflayoutarea
How is you JavaScript written?
Is it like this
Function funcName() {
}
Or is it written like
funcName = function() {};
This is important, and as per the nodes in the documentation there are
issues with JS not working, if you are not following the latter method. If
however you are doing this, can you confirm with me that it is loaded in the
page, or is it included as a separate file in the loading page.
By going to FireFox and using firebug you can confirm that the pages are
loading, after that you can either debug the script and see if it is being
run or not.
Regards,
Andrew Scott
http://www.andyscott.id.au/
-Original Message-
From: Steve Sequenzia [mailto:c...@thinksys.com]
Sent: Monday, 11 April 2011 3:45 PM
To: cf-talk
Subject: Javascript not working inside of cflayoutarea
I have a index page that has a cflayout and a cflayoutarea with a source
to
another cfm page. The cfm page that the cflayoutarea uses as the source
has
a jquery menu in it. When it loads all of the javascript that powers the
jquery
menu is not loading.
I made sure that the javascript source files were being loaded on the
index
page. I have also been trying to get them to load with cfajaximport
scriptSrc
but that is not working.
Here is some code:
cflayout type=hbox
cflayoutarea name=nav source=nav_pos.cfm
/cflayoutarea
/cflayout
The nav_pos.cfm has the jquery on it that is not working.
Any help on this would be great.
Thanks!
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343641
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
Re: Javascript not working inside of cflayoutarea
Andrew,
Thanks for the response.
I fixed the functions to this format - funcName = function() {};. All of the
scripts are in separate files. Do I need to use cfajaximport scriptSrc or can I
just put the scripts into the CFIDE/scripts folder? I am confused how all that
works.
Thanks again.
-Steve
How is you JavaScript written?
Is it like this
Function funcName() {
}
Or is it written like
funcName = function() {};
This is important, and as per the nodes in the documentation there are
issues with JS not working, if you are not following the latter method. If
however you are doing this, can you confirm with me that it is loaded in the
page, or is it included as a separate file in the loading page.
By going to FireFox and using firebug you can confirm that the pages are
loading, after that you can either debug the script and see if it is being
run or not.
Regards,
Andrew Scott
http://www.andyscott.id.au/
I have a index page that has a cflayout and a cflayoutarea with a source
to
another cfm page. The cfm page that the cflayoutarea uses as the source
has
a jquery menu in it. When it loads all of the javascript that powers the
jquery
menu is not loading.
I made sure that the javascript source files were being loaded on the
index
page. I have also been trying to get them to load with cfajaximport
scriptSrc
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343642
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
RE: Javascript not working inside of cflayoutarea
From my experience it is always that people forget that these new UI
features, all created div and other elements in the current page to do what
they need.
Ok having said that, I am betting my bottom dollar that with what you are
returning to be displayed, doesn't contain any htmlbody etc html tags.
This is important because the ColdFusion underneath the hood, needs these
tags to include the extra files etc that they need. And because the main
page is already loaded, ColdFusion can't add them to the current page, from
the page that is being loaded.
I hope that makes sense, there are two options you can try here and option 2
is my preferred method.
Option 1: return the html tags htmlbody etc, this would ensure that the
import the tag on the page, ColdFusion while generating the page can place
the needed code in the header of the page. Downside to this is that you end
up with a malformed dom, and will fail validators.
Option 2: Just place the import on the main page, this might seem overkill
if you are only going to use it once or twice. But the upside is that you
are generating valid html.
Regards,
Andrew Scott
http://www.andyscott.id.au/
-Original Message-
From: Steve Sequenzia [mailto:c...@thinksys.com]
Sent: Monday, 11 April 2011 11:16 PM
To: cf-talk
Subject: Re: Javascript not working inside of cflayoutarea
Andrew,
Thanks for the response.
I fixed the functions to this format - funcName = function() {};. All of
the
scripts are in separate files. Do I need to use cfajaximport scriptSrc or
can I
just put the scripts into the CFIDE/scripts folder? I am confused how all
that
works.
Thanks again.
-Steve
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343643
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
Re: Javascript not working inside of cflayoutarea
Andrew,
I understand what you are saying. I would rather import the files. I just can't
seem to get the syntax right. I am trying this - cfajaximport
scriptsrc=\CFIDE\scripts\jquery\
When I do that all the other ajax stuff on the page does not load. Do I need to
redirect all the files?
Thanks again.
-Steve
From my experience it is always that people forget that these new UI
features, all created div and other elements in the current page to do what
they need.
Ok having said that, I am betting my bottom dollar that with what you are
returning to be displayed, doesn't contain any htmlbody etc html tags.
This is important because the ColdFusion underneath the hood, needs these
tags to include the extra files etc that they need. And because the main
page is already loaded, ColdFusion can't add them to the current page, from
the page that is being loaded.
I hope that makes sense, there are two options you can try here and option 2
is my preferred method.
Option 1: return the html tags htmlbody etc, this would ensure that the
import the tag on the page, ColdFusion while generating the page can place
the needed code in the header of the page. Downside to this is that you end
up with a malformed dom, and will fail validators.
Option 2: Just place the import on the main page, this might seem overkill
if you are only going to use it once or twice. But the upside is that you
are generating valid html.
Regards,
Andrew Scott
http://www.andyscott.id.au/
Andrew,
Thanks for the response.
I fixed the functions to this format - funcName = function() {};. All of
the
scripts are in separate files. Do I need to use cfajaximport scriptSrc or
can I
just put the scripts into the CFIDE/scripts folder? I am confused how all
that
works.
Thanks again.
-Steve
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343645
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
RE: Javascript not working inside of cflayoutarea
Where are you trying to load the jquery from, the main page or the page that gets loaded with the layout? Secondly, did you place the jquery files in the cfide? If not then you might want to go to the jquery website download the jQuery distribution, and use that, or you could use the google CDN version. Have you got an example of your cfajaximport code, it might be that if the above is not true then jquery is being relatively loaded and not absolutely loaded, this means that it is trying to find the jquery package in the wrong directory. Again firebug and the Net option tab in FireFox will quickly show all this for you, for example if it can't find or load a file for any reason it will tell you all this and which files. You can then compare this with they are supposed to be, and fix accordingly. If you aren't using FireBug for FireFox then I would highly recommend this add on, it is invaluable when it comes to development like this. Regards, Andrew Scott http://www.andyscott.id.au/ -Original Message- From: Steve Sequenzia [mailto:c...@thinksys.com] Sent: Tuesday, 12 April 2011 12:31 AM To: cf-talk Subject: Re: Javascript not working inside of cflayoutarea Andrew, I understand what you are saying. I would rather import the files. I just can't seem to get the syntax right. I am trying this - cfajaximport scriptsrc=\CFIDE\scripts\jquery\ When I do that all the other ajax stuff on the page does not load. Do I need to redirect all the files? Thanks again. -Steve ~| Order the Adobe Coldfusion Anthology now! http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343649 Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
Re: Javascript not working inside of cflayoutarea
Steve
cfajaximport scriptsrc=... is only for cf's built-in scripts - you
do not use it to load anything else. and you only need to use it if you
do not have access to default cf's scripts folder or if you have moved
the default cf scripts to another folder.
to load jquery or any other js scripts, you just use your regular
script tags in the head section of your page.
specifically for dealing with scripts in pages loaded into cf's ajax
containers i found this approach working best:
- include your js library (jquery) in the main page (the one that has
cflayout tags in you case)
- include any js code that needs to run after pages have been loaded
into ajax containers as separate js functions in the main page's head
section as well.
- in the pages loaded inside ajax containers add cfset
ajaxonload('name-of-your-js-function-to-execute-here') as the last line
before the closing /body tag: this will run the specified js function
after the page has been loaded inside the container
Azadi
On 11/04/2011 22:31 , Steve Sequenzia wrote:
Andrew,
I understand what you are saying. I would rather import the files. I just
can't seem to get the syntax right. I am trying this -cfajaximport
scriptsrc=\CFIDE\scripts\jquery\
When I do that all the other ajax stuff on the page does not load. Do I need
to redirect all the files?
Thanks again.
-Steve
From my experience it is always that people forget that these new UI
features, all created div and other elements in the current page to do what
they need.
Ok having said that, I am betting my bottom dollar that with what you are
returning to be displayed, doesn't contain anyhtmlbody etc html tags.
This is important because the ColdFusion underneath the hood, needs these
tags to include the extra files etc that they need. And because the main
page is already loaded, ColdFusion can't add them to the current page, from
the page that is being loaded.
I hope that makes sense, there are two options you can try here and option 2
is my preferred method.
Option 1: return the html tagshtmlbody etc, this would ensure that the
import the tag on the page, ColdFusion while generating the page can place
the needed code in the header of the page. Downside to this is that you end
up with a malformed dom, and will fail validators.
Option 2: Just place the import on the main page, this might seem overkill
if you are only going to use it once or twice. But the upside is that you
are generating valid html.
Regards,
Andrew Scott
http://www.andyscott.id.au/
Andrew,
Thanks for the response.
I fixed the functions to this format - funcName = function() {};. All of
the
scripts are in separate files. Do I need to use cfajaximport scriptSrc or
can I
just put the scripts into the CFIDE/scripts folder? I am confused how all
that
works.
Thanks again.
-Steve
~|
Order the Adobe Coldfusion Anthology now!
http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343650
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
Javascript not working inside of cflayoutarea
I have a index page that has a cflayout and a cflayoutarea with a source to another cfm page. The cfm page that the cflayoutarea uses as the source has a jquery menu in it. When it loads all of the javascript that powers the jquery menu is not loading. I made sure that the javascript source files were being loaded on the index page. I have also been trying to get them to load with cfajaximport scriptSrc but that is not working. Here is some code: cflayout type=hbox cflayoutarea name=nav source=nav_pos.cfm /cflayoutarea /cflayout The nav_pos.cfm has the jquery on it that is not working. Any help on this would be great. Thanks! ~| Order the Adobe Coldfusion Anthology now! http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:343640 Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
