1. #1
    Sencha User
    Join Date
    Sep 2008
    Posts
    43
    Vote Rating
    0
    Northie is on a distinguished road

      0  

    Default How do I use the JSON Export

    How do I use the JSON Export


    I've been using the trial version of the Ext Designer and have found it very useful as a starting place; and I've learned a lot from it.

    There is one thing, however, that is confusing me

    When I go to Export, I can view it as Javscript, where a base class is extended with my layout, or there is a pure json version.

    Is there any way I can use the json version to generate the layout?

    For example, I'm looking at getting PHP to output the JSON that will define the layout. Event handlers will come a bit later

  2. #2
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Frederick, MD
    Posts
    1,747
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    You can certainly use the JSON output. Simply click "Copy to Clipboard" and you can paste it into your IDE as either an items configuration of another Container, or pass directly to Ext.ComponentMgr.create. Knowledge of the Ext JS API is helpful, and you should read the docs. Below are both usages:

    Code:
    var myPanel = new Ext.Panel({
        renderTo: Ext.getBody(),
        items: [
            // your JSON config
        ]
    });
    Preferred
    Code:
    var myCmp = Ext.ComponentMgr.create(/* your JSON config */);

  3. #3
    Sencha User
    Join Date
    Sep 2008
    Posts
    43
    Vote Rating
    0
    Northie is on a distinguished road

      0  

    Default


    Many Thanks,

    That makes a lot of sense - I'll try it when I'm back in the office tomorrow

  4. #4
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Frederick, MD
    Posts
    1,747
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    You're quite welcome. I will say though that, generally speaking, it's recommended (in large & complex projects) to instead create & use sub-classes that package up your configuration and behavior. You can define your own xtype's using Ext.reg() and can create a loadable JSON config from your PHP code that is a configuration of your custom xtype'ed sub-classes, rather than a verbose configuration of the Ext JS components. The biggest advantage besides good practice and reuseability/extensibility, is that your behavior & event handlers can be packaged inside of your sub-classes...which is not the case using straight JSON.

  5. #5
    Ext User
    Join Date
    Jun 2009
    Posts
    5
    Vote Rating
    0
    cbourne is on a distinguished road

      0  

    Default More Information

    More Information


    Hi,

    We are looking to do a similar thing to this from our Java Web app. Is there any more documentation or examples on doing this?

    I've been looking for hours and this is all I managed to find. I would of expected the ExtJS docs to have provided a description (and examples) of using server created JSON to dynamically build forms.

    Regards,

    Carl

  6. #6
    Ext User
    Join Date
    Apr 2010
    Posts
    2
    Vote Rating
    0
    gartenmann is on a distinguished road

      0  

    Default


    I tried your two Code examples combined with an ajax call:

    Code:
    success: function(response, opts) {
                      var decodedResponse = Ext.decode(response.responseText);
                      var myCmp = Ext.ComponentMgr.create(decodedResponse);
                      this.window.add(myCmp);
                      this.window.doLayout();
                   }
    While small examples like a form with two fields worked without problems, more complex examples didnt work. Is there a limitation how big a JSON structure can be? It always stops after "Ext.ComponentMgr.create".

  7. #7
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Frederick, MD
    Posts
    1,747
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    Can you send an example of your JSON output? I'd be able to tell you what went wrong...

  8. #8
    Ext User
    Join Date
    Apr 2010
    Posts
    2
    Vote Rating
    0
    gartenmann is on a distinguished road

      0  

    Default


    Thank you for your answer, I just found it myself (at home while taking a shower):
    The ajax call and the JSON output were correct. In my JSON file is a grid and some comboboxes and i just forgot to set up the datastores first. Next time i'll go home and take a shower earlier.. saves hours of debugging ;-)

    Now I can do "lazy loading" of entire forms in my Ext.window-based application. So it can grow without caring about long initial loading times.

    Michael

  9. #9
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Frederick, MD
    Posts
    1,747
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    Sounds most excellent...that's the beauty of xtypes :-) Good deal.

Similar Threads

  1. Replies: 3
    Last Post: 10 May 2010, 9:10 AM
  2. Export Store Data to json
    By mgoncharov in forum Ext 3.x: Help & Discussion
    Replies: 5
    Last Post: 28 Nov 2009, 6:55 PM
  3. Export data as json
    By oe800r in forum Ext 2.x: Help & Discussion
    Replies: 8
    Last Post: 20 Jun 2008, 7:51 AM
  4. How to export data from JSON?
    By Effadreen in forum Ext 1.x: Help & Discussion
    Replies: 7
    Last Post: 19 May 2007, 9:47 AM

Thread Participants: 3

Tags for this Thread