Zen with jQuery

[Jorge Serrão]

Hi,

I created a Page Zen but I need to use jQuery because I need a
progressbar.
I do not know how to use jQuery with Zen, can anyone help me?

Thanks

Jorge Serrão

[Dawn Wolthuis]

Yes we are using it in our development using the approach used by the html5boilerplate and googles cdn for serving it. I just left my windows computer behind traveling to grand kids for the weekend but you can look at this not very pretty generated page to see the js and CSS resources.

Http://prod.snupnow.com/csp/dev/Playground.New.Template.cls

If I typed that accurately. Then in your pages instead of $(#tabs).tabs(... type out jQuery instead of $ like you would use the zen() function.

Thanks to Jason W for his help on this.

Good luck. --dawn

Typed on a mobile keyboard

> --
> You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> To post to this group, send email to InterSys...@googlegroups.com
> To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com
> For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
> Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

[Roberto]

For plain vanilla jQuery, you need to do the following:

1. download a copy of jQuery
2. put this file in the csp/NAMESPACE/js/filename.js (I like putting
external javascripts in a js folder)
3. add it to your page with a parameter: Parameter JSINCLUDES = "js/
jquery-1.7.1.js";
4. and as Dawn pointed out, use the $ selector to get a handle of your
DOM element.

Any more questions, just email back here.

-Roberto

On Feb 17, 2:03 pm, Dawn Wolthuis <dawnwolth...@gmail.com> wrote:
> Yes we are using it in our development using the approach used by the html5boilerplate and googles cdn for serving it. I just left my windows computer behind traveling to grand kids for the weekend but you can look at this not very pretty generated page to see the js and CSS resources.
>
> Http://prod.snupnow.com/csp/dev/Playground.New.Template.cls
>
> If I typed that accurately. Then in your pages instead of $(#tabs).tabs(... type out jQuery instead of $ like you would use the zen() function.
>
> Thanks to Jason W for his help on this.
>
> Good luck. --dawn
>
> Typed on a mobile keyboard
>

> On Feb 17, 2012, at 12:35 PM, Jorge Serrão <jorge.serra...@gmail.com> wrote:
>
>
>
>
>
>
>
> > Hi,
>
> > I created a Page Zen but I need to use jQuery because I need a
> > progressbar.
> > I do not know how to use jQuery with Zen, can anyone help me?
>
> > Thanks
>
> > Jorge Serrão
>
> > --
> > You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> > To post to this group, send email to InterSys...@googlegroups.com
> > To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com

> > For more options, visit this group athttp://groups.google.com/group/InterSystems-ZEN?hl=en
> > Zen Community Terms and Conditions:http://groups.google.com/group/InterSystems-ZEN/web/community-terms-a...

[Jason Warner]

I would recommend getting used to using the jQuery selector over the $
selector in Zen. $ is just an alias for jQuery and in some instances,
Zen will cause the $ selector to no longer be defined, but jQuery will
still be available. Instead of trying to learn when this happens, we
decided to just use jQuery in place of the $ selector. Also, be aware
that when you want to start using things like the $.autocomplete(), you
will need to write code that modifies both the page and the Zen DOM to
keep both in sync.

Jason

[Roberto]

Oh OK. Thanks Jason.

I've only used the $ selector and I haven't had any issues with it.
But if you say that it may be undefined within Zen, then we will not
use it.

Have you any experience with jQuery Mobile?

I'm exploring this right now for a current project.

-Roberto

[Jorge Serrão]

Hi,

I apologize for the delay in my reply.
I had the same error that Jason.
How can implement your solution?
Roberto with PHP your solution is great but in Zen gives error.

Thanks

[Dawn Wolthuis]

If you are referring to the $ issue, everywhere that you write any
jQuery code in Zen, write "jQuery" instead of "$" as the function. So,
for example, it would be

jQuery("#tabs").tabs(...)

instead of $("#tabs").tabs(...)

If your question was about writing code for manipulating both the dom
and the server-side dom, I'm trying to avoid that by sticking to use
of client-only features, but if others pave the way...

--dawn

> For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
> Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

--
Dawn M. Wolthuis

Take and give some delight today

[Jorge Serrão]

I did it:

Parameter JSINCLUDES = "./jquery/ui/jquery-ui-1.8.17.custom.js,./
jquery/external/jquery.bgiframe-2.1.2.js,./jquery/ui/
jquery.ui.core.js,./jquery/ui/jquery.ui.widget.js,./jquery/ui/
jquery.ui.progressbar.js";

Parameter CSSINCLUDES = "./jquery/themes/base/jquery.ui.all.css";

...

<hgroup id ="progressbar"></hgroup>

...

ClientMethod Wait() [ Language = javascript ]
{

jQuery( "#progressbar" ).progressbar({
value: 59
});
}

When I click the button the following error occurs

"jQuery is null or not be defined"

[Dawn Wolthuis]

Try putting this in onloadHandler() and see if that works.

jQuery(document).ready(function() {
jQuery("#progressbar").progressbar({ value: 59}); })

Let me know. --dawn

> For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
> Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

[Roberto]

Hello Jorge,

What is the error that you are getting?

Tip for adding external css/javascript - use either FF with FireBug or
Chrome Developer Tools. With these, you can tell if the external files
have been loaded.

I think that's the first step in fixing the problem.

-Roberto

[Jorge Serrão]

Dawn,

Continues to error but this time says "onloadevt : undifened".
Anyway I can't use this method because this method should be invoked
when client press the button "Search".

Robert I will try these tools.

[Dawn Wolthuis]

Can you see the jQuery libraries through firebug or chrome developer tools?

I am not sure where your issue is, so I'l review what we did. I took
some of these practices from the html5boilerplate. I made a component
named endScripts that prints out the scripts into the html at the end
of the XData. You can see that is includes using the google CDN (easy
enough to do if you suspect that the jQuery stuff is not loading
properly - then later decide whether to host locally
http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/
)

In the endScripts, we have this (in mvbasic, just printing out html,
with colon for concat)

print '<script
src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>'
print '<script>window.jQuery || document.write(' : "'" : '<script
src="js/libs/jquery-1.6.2.min.js"><\/script>' : "'" : ')'
print '</script>'
print '<script
src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>'
print '<script src="plugins.js" defer="defer"></script>'
print '<script src="scripts.js" defer="defer"></script>'

In the scripts.js we have
jQuery(document).ready(function() {
jQuery("#tabs").tabs({ fx: { height: 'toggle', opacity: 'toggle' } });
});

Then when we want to do something with the tab, we use jQuery("#tabs")...

I'm not sure where the magic is in here, but I am not spotting an
error in your code at first glance. Good luck. --dawn

[Roberto]

Jorge,

Yes try these tools.

You have to make sure that the external files are loaded first. That's
the first step.

Also a big ...big...big tip!!!

Make sure that the JQUERY library is the first in the list.

This is needed before any jquery ui stuff!

This is because in the JQUERY library, the JQUERY object is defined.

-Roberto

On Feb 20, 11:27 am, Dawn Wolthuis <dw...@tincat-group.com> wrote:
> Can you see the jQuery libraries through firebug or chrome developer tools?
>
> I am not sure where your issue is, so I'l review what we did. I took
> some of these practices from the html5boilerplate. I made a component
> named endScripts that prints out the scripts into the html at the end
> of the XData. You can see that is includes using the google CDN (easy
> enough to do if you suspect that the jQuery stuff is not loading

> properly - then later decide whether to host locallyhttp://encosia.com/3-reasons-why-you-should-let-google-host-jquery-fo...

[Roberto]

Jorge,

I just read your js includes:

Parameter JSINCLUDES = "./jquery/ui/jquery-ui-1.8.17.custom.js,./
jquery/external/jquery.bgiframe-2.1.2.js,./jquery/ui/
jquery.ui.core.js,./jquery/ui/jquery.ui.widget.js,./jquery/ui/
jquery.ui.progressbar.js";

I don't see the jquery library in here.

-Roberto

[Dawn Wolthuis]

Good catch, Roberto -- yes, switch the order of your jQuery libraries
in your js parameter. --dawn

> For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
> Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

[Jorge Serrão]

Thanks a lot for your help.

The big problem are libraries and your order but still have a little
problem.
When I press the Search button this error appear:
"The object don't support the progressbar method"

[Roberto]

Jorge, fyi, just in case you are not aware:

jquery = library that allows you to select DOM elements and also
simplifies manipulation of these elements.

jquery ui = library that allows you to manipulate DOM elements through
animations and transitions, etc. Has built in "widgets". You need the
jquery library for jquery ui.

jquery mobile = library that allows you to create websites that are
ready for touch enabled smartphones (Android/iPhone, etc.). You need
jquery library for jquery mobile.

1. What is the code you have that is causing your current error?
2. What is the element in your XDATA Content that this error is
referring to?

-Roberto

[Jorge Serrão]

Roberto,

I know what libraries do.

I have:

<hgroup id ="progressbar"></hgroup> - where the progressbar will
appear.
<dynaGrid>...</dynaGrid> - where results are written.
<button name = Search> - where user press for get results.

When user press the button the method "Search" will be invoked.
This method contains:

ClientMethod Search() [ Language = javascript ]
{

jQuery(document).ready(function() {
jQuery("#progressbar").progressbar({ value: 59}); })

...

[Roberto]

OK. I just wanted to make sure that you understand how jQuery
interfaces with Zen so that others here can help.

OK, so when the user clicks the "Search" button, what is the error
that you are now getting?

-Roberto

> ...
>
> read more »

[Jorge Serrão]

I get this error:

The Object does not support property or method progressbar

> ...
>
> mais informações »

[Jorge Serrão]

Roberto and Dawn,

thanks a lot for your help but the problem is solved

> ...
>
> mais informações »

[Jonathan Levinson]

How did you solve the problem Jorge? I've been following this thread with great interest.

Thanks,
Jonathan

> "InterSystems: Zen Community" group.
> To post to this group, send email to InterSys...@googlegroups.com To

> unsubscribe from this group, send email to InterSystems-ZEN-
> unsub...@googlegroups.com

> For more options, visit this group at
> http://groups.google.com/group/InterSystems-ZEN?hl=en

> Zen Community Terms and Conditions:
> http://groups.google.com/group/InterSystems-ZEN/web/community-terms-
> and-conditions

[Jorge Serrão]

Jonathan,

I replace my JSINCLUDES and CSSINCLUDES parameters for the site of
jQuery and worked.
But now I have a new problem. I need to run this method and then
execute a Zen method but it performs the Zen method first and
JavaScript after.

On 20 Fev, 18:15, Jonathan Levinson

> ...
>
> mais informações »

[Dawn Wolthuis]

Can you call the zen method from js and have the zenPage.someJs()
method as the event handling method instead? --dawn

> --
> You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> To post to this group, send email to InterSys...@googlegroups.com

> To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com

> For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
> Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

--

[Roberto]

Jorge,

I'm not quite sure what you mean by:

"But now I have a new problem. I need to run this method and then
execute a Zen method but it performs the Zen method first and
JavaScript after."

Can you explain more?

But this works for me:
Parameter JSINCLUDES = "js/jquery-1.7.1.js,js/jquery-
ui-1.8.17.custom.min.js,js/dev/ui/jquery.ui.core.js";
Parameter CSSINCLUDES = "js/dev/themes/ui-lightness/
jquery.ui.all.css";

Property progressbarValue As %Integer [ InitialExpression = 0 ];

<hgroup id="progressbar" enclosingStyle="background-
color:white;color:black;height:100px;">
</hgroup>
<button onclick="zenPage.ProgressBar()" caption="Go!"/>


ClientMethod ProgressBar() [ Language = javascript ]
{
if (zenPage.progressbarValue!=100) {

jQuery('#progressbar').progressbar({value:zenPage.progressbarValue});
zenPage.progressbarValue=++(zenPage.progressbarValue)
setTimeout('zenPage.ProgressBar()',1000);
}
else {
alert('Done!');
}
}


-Roberto

> ...
>
> read more »

[Roberto]

Oh, I just read again your last post.

Could it be timing issues???

This works for me with a ZenMethod:

ClientMethod ProgressBar() [ Language = javascript ]
{
if (zenPage.progressbarValue!=100) {

jQuery('#progressbar').progressbar({value:zenPage.progressbarValue});
zenPage.progressbarValue=++(zenPage.progressbarValue)
setTimeout('zenPage.ProgressBar()',1000);

var status=zenPage.DoNothing();
}
else {
alert('Done!');
}
}

ClassMethod DoNothing() As %Integer [ ZenMethod ]
{
Hang 1
Quit 1
}


-Roberto

> ...
>
> read more »

[Jorge Serrão]

Sorry if my explanation was bad.

My problem is:

I have a form that patients seeking, you can introduce name or
whatever.
When you press "Search" button the method SearchPatient is executed.
This method execute the progressbar and call a zen method to fetch the
results to the database.
Then fills a dynaGrid with results.
Happens that it fills the first dynagrid and then runs the progress
bar.

I hope to have better explained.

> ...
>
> mais informações »

[Neerav Verma]

Yea is there a progress bar working example

Cheers,
Neerav

Sent from my iPhone

[Roberto]

OK.

Did you know that the progress bar in jQuery is just a fancy way of
coloring a div by a percentage using the jQuery plug in?

You need to programmatically call the progressbar() method
incrementing by a percentage each time. The sample one I posted
incremented by 1 percent. After you increment, you need to call the
progressbar() method of the div again over and over until it is
completely filled in.

Are you just calling this progressbar() once?

The progressbar() method is good if you know exactly where in the
process the "progress" is. If you do not know where the process is or
what progress it is doing, it is better to have animated gifs instead.

Hope this helps.

-Roberto

> ...
>
> read more »

[Ken Thorseth]

---

From: Roberto
Sent: 2/20/2012 10:32 AM

To: InterSystems: Zen Community
Subject: [InterSystems-Zen] Re: Zen with jQuery

> src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></sc ript>'

>     print '<script src="plugins.js" defer="defer"></script>'
>     print '<script src="scripts.js" defer="defer"></script>'
>
> In the scripts.js we have
> jQuery(document).ready(function() {
>     jQuery("#tabs").tabs({ fx: { height: 'toggle', opacity: 'toggle' } });
>
> });
>
> Then when we want to do something with the tab, we use jQuery("#tabs")...
>
> I'm not sure where the magic is in here, but I am not spotting an
> error in your code at first glance.  Good luck.  --dawn
>
>
>
>
>
>
>
>
>
> On Mon, Feb 20, 2012 at 10:18 AM, Jorge Serrão <jorge.serra...@gmail.com> wrote:
> > Dawn,
>
> > Continues to error but this time says "onloadevt : undifened".
> > Anyway I can't use this method because this method should be invoked
> > when client press the button "Search".
>
> > Robert I will try these tools.
>
> > On 20 Fev, 16:09, Roberto <rcaha...@gmail.com> wrote:
> >> Hello Jorge,
>
> >> What is the error that you are getting?
>

> >> Tip for adding external css/javascript - use either FF with FireBug or
> >> Chrome Developer Tools. With these, you can tell if the external files
> >> have been loaded.
>
> >> I think that's the first step in fixing the problem.
>
> >> -Roberto
>
> >> On Feb 20, 9:17 am, Jorge Serrão <jorge.serra...@gmail.com> wrote:
>
> >> > Hi,
>
> >> > I apologize for the delay in my reply.
> >> > I had the same error that Jason.
> >> > How can implement your solution?
> >> > Roberto with PHP your solution is great but in Zen gives error.
>
> >> > Thanks
>
> >> > On 17 Fev, 21:28, Roberto <rcaha...@gmail.com> wrote:
>
> >> > > Oh OK. Thanks Jason.
>

> >> > > I've only used the $ selector and I haven't had any issues with it.
> >> > > But if you say that it may be undefined within Zen, then we will not
> >> > > use it.
>
> >> > > Have you any experience with jQuery Mobile?
>
> >> > > I'm exploring this right now for a current project.
>
> >> > > -Roberto
>
> >> > > On Feb 17, 3:59 pm, Jason Warner <jas...@brashers.com> wrote:
>
> >> > > > I would recommend getting used to using the jQuery selector over the $
> >> > > > selector in Zen. $ is just an alias for jQuery and in some instances,
> >> > > > Zen will cause the $ selector to no longer be defined, but jQuery will
> >> > > > still be available. Instead of trying to learn when this happens, we
> >> > > > decided to just use jQuery in place of the $ selector. Also, be aware
> >> > > > that when you want to start using things like the $.autocomplete(), you
> >> > > > will need to write code that modifies both the page and the Zen DOM to
> >> > > > keep both in sync.
>
> >> > > > Jason
>
> >> > > > On Friday, February 17, 2012 1:32:17 PM, Roberto wrote:
> >> > > > > For plain vanilla jQuery, you need to do the following:
>

> >> > > > > 1. download a copy of jQuery
> >> > > > > 2. put this file in the csp/NAMESPACE/js/filename.js (I like putting
> >> > > > > external javascripts in a js folder)
> >> > > > > 3. add it to your page with a parameter: Parameter JSINCLUDES = "js/
> >> > > > > jquery-1.7.1.js";
> >> > > > > 4. and as Dawn pointed out, use the $ selector to get a handle of your
> >> > > > > DOM element.
>
> >> > > > > Any more questions, just email back here.
>
> >> > > > > -Roberto
>
> >> > > > > On Feb 17, 2:03 pm, Dawn Wolthuis<dawnwolth...@gmail.com>  wrote:

> >> > > > >> Yes we are using it in our development using the approach used by the html5boilerplate and googles cdn for serving it. I just left my windows computer behind traveling to grand kids for the weekend but you can look at this not very pretty generated page to see the js and CSS resources.

>
> >> > > > >> Http://prod.snupnow.com/csp/dev/Playground.New.Template.cls
>
> >> > > > >> If I typed that accurately. Then in your pages instead of $(#tabs).tabs(... type out jQuery instead of $ like you would use the zen() function.
>
> >> > > > >> Thanks to Jason W for his help on this.
>
> >> > > > >> Good luck. --dawn
>
> >> > > > >> Typed on a mobile keyboard
>

> >> > > > >> On Feb 17, 2012, at 12:35 PM, Jorge Serrão<jorge.serra...@gmail.com>  wrote:
>
> >> > > > >>> Hi,
>
> >> > > > >>> I created a Page Zen but I need to use jQuery because I need a
> >> > > > >>> progressbar.
> >> > > > >>> I do not know how to use jQuery with Zen, can anyone help me?
>
> >> > > > >>> Thanks
>
> >> > > > >>> Jorge Serrão
>

> >> > > > >>> --
> >> > > > >>> You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> >> > > > >>> To post to this group, send email to InterSys...@googlegroups.com
> >> > > > >>> To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com

> >> > > > >>> For more options, visit this group athttp://groups.google.com/group/InterSystems-ZEN?hl=en
> >> > > > >>> Zen Community Terms and Conditions:http://groups.google.com/group/InterSystems-ZEN/web/community-terms-a...

>
> > --
> > You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> > To post to this group, send email to InterSys...@googlegroups.com
> > To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com

> > For more options, visit this group athttp://groups.google.com/group/InterSystems-ZEN?hl=en
> > Zen Community Terms and Conditions:http://groups.google.com/group/InterSystems-ZEN/web/community-terms-a...

>
> --
> Dawn M. Wolthuis
>
> Take and give some delight today

[Jorge Serrão]

My first goal was create a mouse animation but I had a same problem.
JavaScript was executed after Zen Method, it's strange but it's real.

On 20 Fev, 19:54, Ken Thorseth <kthors...@yahoo.com> wrote:
> From:RobertoSent:2/20/2012 10:32 AMTo:InterSystems: Zen CommunitySubject:[InterSystems-Zen] Re: Zen with jQuery

> > > Zen Community Terms and ...
>
> mais informações »

[Roberto]

If all you want is to make a mouse cursor with the wait/hourglass, I
have been using this:

<button caption="Search" onclick="zenPage.StartSearch()"/>

ClientMethod StartSearch() [ language = javascript ]
{
if (zenPage.NewVar1==undefined) {
zenPage.NewVar1='defined';
document.body.style.cursor='wait';
setTimeout('zenPage.ProgressBar()',1000);
}
else {
var status=zenPage.DoNothing();
document.body.style.cursor='default';

}
}

ClassMethod DoNothing() As %Integer [ ZenMethod ]
{

//wait 15 seconds!!!
hang 15
Quit 1
}

-Roberto

[Dawn Wolthuis]

While I did get this statement to work --

document.body.style.cursor='wait';

I am forgetting what I encountered, but I tried to do this with statements like

zenPage.enclosingClass = "progressCursor";

and css like

.progressCursor {
cursor: progress;
}
.defaultCursor {
cursor: default;
}

but I do not recall getting that to work nicely (it might have been a
cross-browser issue, I'm forgetting now). Has anyone figured out Zen
and a css-cursor progress indicator? --dawn

> For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
> Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

[Roberto]

Yes, you need to use the setTimeout function along with some kind of
flag.

Check my little code snippet above.

That works with all browsers (IE, FF, Chrome, Safari) that I've
tested.

-Roberto

[Jorge Serrão]

It's a good code.

But for execute DoNothing() method, I need press button 2 times or
not?
I tried use mouse wait but I had a error because body was undefined

> ...
>
> mais informações »

[Derek Day]

With the Quit 1 example - Zen will use a synchronous call -- no JavaScript will be executed until the call is finished!!! That is why Dawn and others went with the animated gif.

If you want to actually get a real indication of progress you have to make sure that you are using asynchronous calls -- in Zen these are ZenMethods without a return value -- you can also use background tasks.

~Derek

> >> > > error in your code at first glance.  Good luck..  --dawn

>
> >> > > On Mon, Feb 20, 2012 at 10:18 AM, Jorge Serrão <jorge.serra...@gmail.com> wrote:
> >> > > > Dawn,
>
> >> > > > Continues to error but this time says "onloadevt : undifened".
> >> > > > Anyway I can't use this method because this method should be invoked
> >> > > > when client press the button "Search".
>
> >> > > > Robert I will try these tools.
>
> >> > > > On 20 Fev, 16:09, Roberto <rcaha...@gmail.com> wrote:
> >> > > >> Hello Jorge,
>
> >> > > >> What is the error that you are getting?
>
> >> > > >> Tip for adding external css/javascript - use either FF with FireBug or
> >> > > >> Chrome Developer Tools. With these, you can tell if the external files
> >> > > >> have been loaded.
>
> >> > > >> I think that's the first step in fixing the problem.
>
> >> > > >> -Roberto
>
> >> > > >> On Feb 20, 9:17 am, Jorge Serrão <jorge.serra...@gmail.com> wrote:
>
> >> > > >> > Hi,
>

> >> > > >> > I apologize for the delay in my reply..

> >> > > >> > > > > On Feb 17, 2:03 pm, Dawn Wolthuis<dawnwolth...@gmail..com>  wrote:

> >> > > >> > > > >> Yes we are using it in our development using the approach used by the html5boilerplate and googles cdn for serving it. I just left my windows computer behind traveling to grand kids for the weekend but you can look at this not very pretty generated page to see the js and CSS resources.
>
> >> > > >> > > > >> Http://prod.snupnow.com/csp/dev/Playground.New.Template.cls
>
> >> > > >> > > > >> If I typed that accurately. Then in your pages instead of $(#tabs).tabs(... type out jQuery instead of $ like you would use the zen() function.
>
> >> > > >> > > > >> Thanks to Jason W for his help on this.
>
> >> > > >> > > > >> Good luck. --dawn
>
> >> > > >> > > > >> Typed on a mobile keyboard
>
> >> > > >> > > > >> On Feb 17, 2012, at 12:35 PM, Jorge Serrão<jorge.serra...@gmail.com>  wrote:
>
> >> > > >> > > > >>> Hi,
>
> >> > > >> > > > >>> I created a Page Zen but I need to use jQuery because I need a
> >> > > >> > > > >>> progressbar.
> >> > > >> > > > >>> I do not know how to use jQuery with Zen, can anyone help me?
>
> >> > > >> > > > >>> Thanks
>
> >> > > >> > > > >>> Jorge Serrão
>
> >> > > >> > > > >>> --
> >> > > >> > > > >>> You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> >> > > >> > > > >>> To post to this group, send email to InterSys...@googlegroups.com
> >> > > >> > > > >>> To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com
> >> > > >> > > > >>> For more options, visit this group athttp://groups.google.com/group/InterSystems-ZEN?hl=en
> >> > > >> > > > >>> Zen Community Terms and Conditions:http://groups.google.com/group/InterSystems-ZEN/web/community-terms-a...
>
> >> > > > --
> >> > > > You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.

> >> > > > To post to this group, send email to InterSystems-ZEN@googlegroups..com

> >> > > > To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com
> >> > > > For more options, visit this group athttp://groups.google.com/group/InterSystems-ZEN?hl=en
> >> > > > Zen Community Terms and ...
>
> >> > mais informações »
>
> > --
> > You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
> > To post to this group, send email to InterSys...@googlegroups.com
> > To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com
> > For more options, visit this group athttp://groups.google.com/group/InterSystems-ZEN?hl=en
> > Zen Community Terms and Conditions:http://groups.google.com/group/InterSystems-ZEN/web/community-terms-a...
>
> --

> Dawn M. Wolthuis
>
> Take and give some delight today

--
You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
To post to this group, send email to InterSys...@googlegroups.com
To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com

For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

[Mario]

What I usually do (and works) is to create a component and use the
onloadHandler like this:

ClientMethod onloadHandler() [ Language = javascript ]
{
var el = this.findElement('control');

then call the jquery like this:
$(el).whateverXXXX

Not sure how this fits in this particular component (progress bar)
but is the way I implemented for others.

> > >> > > > > > > > > > >> > > Oh OK. Thanks Jason....
>
> leer más »

[Mario]

Roberto,
I started playing with jquery Mobile and it seems to work in general
until I started to use active groups. There is something in the jquery
mobile css that is producing a null error in the ZLM from Zen.
I love the active groups as is the best way to implement the classical
split for iPad email, where you can scroll independently every side,
so having jquery mobile and active groups could be very interesting.

If I´m able to find more I will post it.

Regards,
Mario

> > > On Feb 17, 2:03 pm, Dawn Wolthuis<dawnwolth...@gmail.com>  wrote:

> > >> Yes we are using it in our development using the approach used by the html5boilerplate and googles cdn for serving it. I just left my windows computer behind traveling to grand kids for the weekend but you can look at this not very pretty generated page to see the js and CSS resources.
>
> > >> Http://prod.snupnow.com/csp/dev/Playground.New.Template.cls
>
> > >> If I typed that accurately. Then in your pages instead of $(#tabs).tabs(... type out jQuery instead of $ like you would use the zen() function.
>
> > >> Thanks to Jason W for his help on this.
>
> > >> Good luck. --dawn
>
> > >> Typed on a mobile keyboard
>

[Jason Warner]

It has been a while since I've written Zen code, but I think that when
certain callback functions were invoked in Zen, the $ selector no longer
worked. I am having trouble remembering the specifics, but my suggestion
is to avoid the situation and stick with the jQuery selector instead.

Jason

>>>> On Feb 17, 2012, at 12:35 PM, Jorge Serr�o<jorge.serra...@gmail.com> wrote:
>>>>> Hi,
>>>>> I created a Page Zen but I need to use jQuery because I need a
>>>>> progressbar.
>>>>> I do not know how to use jQuery with Zen, can anyone help me?
>>>>> Thanks

>>>>> Jorge Serr�o