Refresh/Reload Flex App using JavaScript code.

When you search to accomplish a task in Flex and can’t do it, then look for it in JavaScript because many of things that are not possible in Flex are possible using JavaScript which is the backbone of your Flex App.

I had a requirement were i wanted to refresh/reload the Flex App ,but i couldn’t do it in Flex and finally i realized that it may be possible using JavaScript then i went for it and coded, “WOW” i said to my self because it worked ,my App got reloaded/refreshed.

Then decided to post it in Blog, because it may help out other Flex lovers.

Code Example:

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”absolute”>
<mx:Button x=”83″ y=”196″ label=”Button” click=”reloadpage(event)”/>
<mx:Script>
<![CDATA[
private function reloadpage(event:MouseEvent):void
{
var ref:URLRequest = new URLRequest(“javascript:location.reload(true)”);
navigateToURL(ref, “_self”);
}
]]>
</mx:Script>
</mx:Application>

Here on click of Button the App is reloaded/refreshed.Isn’t cool.

40 Responses to Refresh/Reload Flex App using JavaScript code.

  1. roora99 says:

    It’s very useful for me..

    thank you!

  2. Mancho says:

    Thank you!

    Another question?

    Do you know the proceed for clear text, input, etc with data when I click a button?
    or dou you know the proceed for reload a panel or another component?

    I wait your answer!

    Thanks!

  3. kumargandhi says:

    hi
    your welcome,and about the question : if you want to clear the text in a TextInput control then do:
    idTextInput.text=””;

    This will clear the text on button click [as you require ] .
    There is no way to reload a component, panel is a container which has our controls and hold the required ,so to reload there is a way like call a function and mention your code in it which you want to refresh like clear text and others like send services this will do i hope,The existing property of a component can be used “creationComplete” and call a function in it which will reset the controls.

    comment for queries.

    regards,
    kumar.

  4. Ram says:

    yes! it works like a charm… but is it possible to refresh a canvas component alone?
    To add more oil to the fire… the canvas component is actually one which is built as a separate screen.

    Please try and give me some suggestions.

  5. kumargandhi says:

    Reload the Canvas Component .

  6. Ram says:

    Its like this…
    I have a view stack, and have a numbe of canvases under it.
    and when the values in a tree changes, i have to reload the canvas accordingly.

  7. Ram says:

    And can i use the same code to reload a canvas component?
    I cant right?

  8. kumargandhi says:

    hi Ram,

    read about Modules in Flex , they are very usefull when taking about different and seperated views, it will defenately solve the problem. your requirement.

    regards,
    kumar.

  9. eytan says:

    i spent hours in flex getting my components to communicate and to clear data when they are not being used and reload data accordingly , within flex to speed things up, but a button that refreshes the page for you is beautifull. Takes a little longer then clearing memory directly in flex but , makes my life lots easier , so many thanx! i needed this!

  10. Shashi says:

    It’s great.

    I Spent long time for refreshing… but failed

    Thanks !!!!!!!!!

  11. Vivek Manchanda says:

    Thanks a lot

    This thing really works for me ..

    Thanks Buddy

  12. YL says:

    This is very very good.

    One more question, could we control the reload period? Such as in every two seconds we do the reload.

  13. kumargandhi says:

    Yes its possible, there’s a post here on usage of Timer Class just refer that and using this Timer Class we can raise an event at specified Time interval. For you just call the function on the given interval, so that function will refresh the App.

    Refer :: Timer Class and its methods.
    Link for the Usage of Timer Class .

    Using Timer Class in Flex.



    Comment for any queries.
    regards,
    kumar.

  14. YL says:

    Thanks Kumar.
    It works!!!!!

  15. cl kim says:

    Kumar,
    Using javascript to reload/refresh app is elegant, and works! Many thanks for sharing…

  16. Kieran says:

    Cheers dude, worked a treat.

    Might be worth mentioning that this also works from anywhere in ActionScript:

    flash.net.navigateToURL(ref, “_self”);

    Noting that navigateToURL comes from flash.net

  17. Deepak Tolani says:

    Hey it worked…Thanks a ton….

  18. Atin says:

    Thanks dude!! This is helpful man

  19. mandy says:

    I have try your solution. The page can be reload. However, after reload, my timer stop counting. What happened?Any solution?Thanks

    • kumargandhi says:

      Hi,

      After the reload the Application is re-initialized means everything starts over again.The Timer you are using also re-initializes.If you want to access the previous counter value you got to store the value for this use the SharedObjects concept[browser cookies in Flex]there are posts here in my blog.comment for queries.

      regards,
      kumar.

  20. Jeff says:

    You are the MAN!!!

    Thank you so much. You saved me tons of time trying to figure this out in actionscript for Flex 3 and I still would never have been successful.

    You are a life saver.
    Thanks,
    -Jeff

  21. Vitalik says:

    hi kumargandhi!
    thats cool that you post …
    but can you help me ….
    i have a problem when a flex app is reload i get an error becouse it secondary registraite the historyManager in creationComplete event , can you tell how can i know that that page wich hold flex app is reloaded inside flex app …if this posible or not inside flex app?
    thanks

  22. prakash says:

    hi,

    very useful tutorial, Thanks.
    I’ve a question, by using javascript in flex, how to create a folder in desktop?
    flex it’s not support ActiveXObject(“scripting.filesystemobject”); ?

    anybady have any idea about create a folder in flex…..?

    Thanks in advance.
    prakash.

  23. Abbas Ali Butt says:

    Hi
    Very useful tutorial and explain in a very simple manner. Thanx for upload such a helpful material.

    Regards
    Abbas Ali Butt

  24. ritu says:

    In my Project i have used module
    loaders in viewsatck . When i did some operation in any module and go to
    some other module ,when i come back to the previous module am able to see
    the operations which i have done in this module. Am facing this problem
    since many days . I want the data to be refreshed everytime i visit my
    previous modules .

  25. juan abreu says:

    DUDE !!! you are the man thanks for this tip.

  26. mohamedkamil says:

    Thank you very much Kumar
    when i stuggle to reset my app, ur code helped me
    write more hacks

  27. Eugene says:

    Your example doesn’t work in IE (at least in IE7).

  28. resnick says:

    great example.. been trying hard to find this solution

  29. Mackson says:

    Thank`s a lot!

  30. ramesh says:

    Hello,
    Kumar,I have a problem with ctrl+s,Alt+n keys.
    this keys it’s not working in IE,You have any idea on shortcut key’s create.
    and one more when i press the f5 button my app. run from starting page i don’t wont that style i want current page refresh can you help me.
    i will wait for your reply

  31. Shishir says:

    Thank you..!!!

  32. ashok says:

    Thanks a lot for refreshing application code.

  33. jason says:

    Just wanted to say i search the whole internet for 8 days trying to resolve this problem, if i had any money i would give you some as you have enabled my dream to continue 🙂 for a second there i thought i was going mad.
    Wished i could understand the code a little more as i would like to attach the code to a different component but still refreshing another component if you can understand that!

  34. Milton says:

    Oh Man … searched many days …..

    Thanks for you…

  35. Nirmalya Saha says:

    I have a application with login screen. After login, user will see another screen. The another screen is added with addChild, when the login screen is removed with removeChild. The login screen and after login screen are custom components.

    Now when i refresh the browser, the application returns in the login screen. I want to remain in the same place. I tried with HistoryManager, but i cant make it.

    Please help me out. Thanks in advance.

  36. venkatesh says:

    In my flex application so many workspace are there i want to refresh the particular workspace with out touching the url part can any one help me……………..

Leave a reply to Shashi Cancel reply