Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Ext JS 3.0 Cookbook
  • Table Of Contents Toc
Ext JS 3.0 Cookbook

Ext JS 3.0 Cookbook

4.7 (6)
close
close
Ext JS 3.0 Cookbook

Ext JS 3.0 Cookbook

4.7 (6)

Overview of this book

Using Ext JS you can easily build desktop-style interfaces in your web applications. Over 400,000 developers are working smarter with Ext JS and yet most of them fail to exercise all of the features that this powerful JavaScript library has to offer. Get to grips with all of the features that you would expect with this quick and easy-to-follow Ext JS Cookbook. This book provides clear instructions for getting the most out of Ext JS with and offers many exercises to build impressive rich internet applications. This cookbook shows techniques and "patterns" for building particular interface styles and features in Ext JS. Pick what you want and move ahead. It teaches you how to use all of the Ext JS widgets and components smartly, through practical examples and exercises. Native and custom layouts, forms, grids, listviews, treeviews, charts, tab panels, menus, toolbars, and many more components are covered in a multitude of examples.The book also looks at best practices on data storage, application architecture, code organization, presenting recipes for improving themóour cookbook provides expert information for people working with Ext JS.
Table of Contents (15 chapters)
close
close
Ext JS 3.0 Cookbook
Credits
About the Author
About the Reviewer
Preface

Encoding and decoding JSON


Converting JavaScript and Ext JS objects to JSON, and converting JSON data back to JavaScript objects is easily achievable with Ext JS. For example, here's how to JSON-encode an array and how to rebuild the array from its JSON representation:

Note

JavaScript Object Notation (JSON) is a lightweight text format where an object is represented with an unordered set of name/value pairs and an array with an ordered collection of values.

JSON is completely language independent, easy for humans to read and write, and easy for machines to parse and generate. These properties make JSON an ideal data-interchange format.

Find out more about JSON at www.json.org.

How to do it...

Let's encode an array of colors using the following steps:

  1. 1. Create an array called colorsArray:

    var colorsArray = new Array();
    
  2. 2. Put some values in the array:

    colorsArray[0] = 'Blue';
    colorsArray[1] = 'Red';
    colorsArray[2] = 'White';
    
  3. 3. Now, convert to JSON:

    var colorsJson = Ext.encode(colorsArray);
    

    The value of the colorsJson variable should be the string ["Blue","Red","White"] string

  4. 4. Let's re-create the array based on its JSON string. Take the JSON representation of colorsArray:

    var colorsJson = '["Blue","Red","White"]';
    
  5. 5. Parse the JSON and rebuild the array:

    var colorsArray = Ext.decode(colorsJson);
    

After this, colorsArray contains the colors data: colorsArray[0] is 'Blue', colorsArray[1] is 'Red', and colorsArray[2] is 'White'.

How it works...

To obtain a JSON representation of an array, object, or other value, pass the value to Ext.util.JSON.encode(object). You can also use the shorthand, Ext.encode(object).

You can parse a JSON string by using Ext.util.JSON.decode(json), or its shorthand Ext.decode(json).

While decoding JSON involves simply calling the JavaScript eval(String) function, the encoding process is more complicated and requires different implementations depending on the data type being encoded. Internally, the encode(object) function calls specialized encoding functions for arrays, dates, Boolean values, strings, and other types.

You can also set the Ext.USE_NATIVE_JSON property to true, which will cause calls to encode(object) and decode(json) to use the browser's native JSON handling features. This option is turned off by default. If you turn it on, beware that native JSON methods will not work on objects that have functions, and that property names should be quoted in order for the data to be correctly decoded.

There's more...

JSON encoding and decoding is a pillar of modern web development, given the role of JSON—a language-independent, data-interchange format—in facilitating communications between the client-side and server-side of web applications. For instance, you can expect to find JSON manipulation when your application needs to send data to the server, as well as when the application needs to dynamically create objects from server-supplied data.

See also...

  • The next recipe, Encoding and decoding URL data, shows how to do two-way conversion between objects and URL data.

CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Ext JS 3.0 Cookbook
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon