Using jQuery in a Flex Application

This is a follow up to my previous post on how to invoke a JavaScript function in an HTML document hosted in a Flex application (using the StageWebView).

The Flex application of course doesn’t care about — and is not aware of — the way your JavaScript is written and which libraries you use. However, I’m currently working on a hybrid mobile application where the HTML hosted in the StageWebView is powered by jQuery, and I find the combination of the two technologies powerful. So I figured I’d share a simple example here.

This is the same example as the one in my previous post with the exception that the HTML part is powered by jQuery.

You can download the Flex project here: http://coenraets.org/webview/StageWebViewJQueryDemo.fxp

The HTML and JavaScript files are here:

  • It’s Amazing!

    Nice example.. thanks Coenraets!

    • Recognize that certainly nothing can make you seriously feel that way without having your consent. It is nonetheless common for persons to send below the belt words and yet so long as you are up against them at first, they don’t really do the same. There may be really a need to stay by how you feel even it is being confronted by a number of rivalry.

  • amlan

    Thanks for the great example but can you show a demo of how to do the same thing with a local javascript file (in the assets folder of the project).

    Thanks in advance

  • Hi amlan,

    You could try open local html with this code:


    protected var fUrl:String = new File(new File("app:/assets/html/index.html").nativePath).url;

    webView.loadURL(fUrl);

    I tried here and it’s also worked with jquery.

    Best regards..

  • Here’s a real world example.
    http://www.brettunsvillage.com

  • Arthur

    Hi,

    Does Flex 4.5 support printing on all the mobile platform? e.g. iOS?

  • Arthur

    Hi,

    Also I want to know that is it possible to, e.g. add iAd to the app created by Flex?

  • soul

    I agree with ur statements here but something bothers me about stagewebview, its an iframe and causes the dreaded flash of unstyled content, in other words the screen flashes white on every re orientation and page load, I would really appreciate some guidence from u regarding this phenomena.

  • VM’s are cool, but they’re a terribly inefficient solution for browser testing. A completely new OS install to configure and keep patched, just to test the site on two versions of the same browser?

  • No matter what you’ll order – light animation, goods calculator or a serious and powerful corporate application – you’ll get elegant, interactive, cross-platform solutions whose functionality and possibilities will be as good as desktop applications. Flex technology best suits for this purpose specially if you use jquery for its tandem.

    Bachelor of Sports Business

  • soul

    Hunny u got voicemail now come and talk pls otherwise it looks like shameless seo.

  • soul

    Since running ur examples my applications always run in debug mode. Thanks cant fix it.

  • soul

    Overlaying the sdk seemed to fix it…!!!!

  • soul

    opps…so sorry it was someone elses…apologies

  • Avors

    Hi

    Thanks for your post. I am using StageWebView to show PDF file on my mobile application(using Flex 4.5 for IOS app development). So far I have managed to show the PDF file and easily dispose SWV when user click on a close button (same as back button in your example).
    Issue: I’m trying to provide a list view for the PDF file and also enable users to boomark a page on the PDF document.
    Is there any way to do these kind of things in Flex?
    I have another question which could be used as an alternative to the first issue:
    when We open a PDF file in safari, an action bar appears on top of the document that shows the document name and a “Open in iBook” button. is any way to show this action bar on StageWebView in the Flex app?
    I’m developing this app for iPad.

    Many thanks in advance for your help.

  • Bos

    Hi Chris, I’m really impressed with your assist on this tanceopic. I will kindly need your assistance. I’m a creative designer and I’m working on a small idea relating to this topic.

    I’ve several web pages & a pdf document with 10 pages locally hosted(on my computer) that I want to display within a flex mobile application I am working on. My intention is to use a next and previous page button/or a swipe gesture in the flex application to browse/navigate each pages of the pdf/web pages. Please kindly assist I’m new to flex mobile and actionscript; but willing to learn. Please help.

  • Excellent project, a new application carefully, and will continue to report.

  • Saidi Reddy

    Hi Sir, i have one query could u please help me , Panel control not supported in Flex Mobile Project in Flash builder 4.5. There is any alternate control to add some data dynamically (using Actin Script). please help me thanks in advance …

  • Thanks, this blog is very good!!

  • Conceive that definitely nothing can make you really feel that way while not having your consent. It is but usual for individuals to make below the belt words yet , so long as you face them in advance, they don’t go about doing the same. There is really a need to stay by how you feel even it really is being faced with a number of counteraction.

  • No matter what you’ll order – light animation, goods calculator or a serious and powerful corporate application – you’ll get elegant, interactive, cross-platform solutions whose functionality and possibilities will be as good as desktop applications. Flex technology best suits for this purpose specially if you use jquery for its tandem.

  • Pingback: Using jQuery in a Flex Application | TechnoVeille()

  • there are produced two types of Model I and other special digital printing.
      His highest production of our company, we use the sport socks products: cotton, cotton, polyester, nylon and lycra. Anti-bacterial means comprises

css.php