JSON data processing protocol and method

Source: Internet
Author: User

the JSONLearning I. OverviewJSON (JavaScript Object Notation) is a lightweight data interchange format that is ideal for data interchange formats in a completely language-independent text format.    At the same time, JSON is a native JavaScript format, which means that working with JSON data in JavaScript does not require any special APIs or toolkits. In JSON, there are two kinds of structures: objects and arrays. 1. ObjectsAn object ends with "{" Starting with "}".    Each "key" followed by a ":", "' Key/value ' pair" is applied "," separated. Packjson = {"Name": "Nikita", "Password": "1111"}     2. ArraysPackjson = [{"Name": "Nikita", "Password": "1111"}, {"Name": "Tony", "Password": "2222"}]; An array is an ordered collection of values. An array ends with "[" Start, "]". Use "," to separate values. Ii. Conversion of JSON objects and JSON stringsIn the data transfer process, JSON is passed in the form of text, which is a string, and JS operates on a JSON object, so the conversion between the JSON object and the JSON string is key. I need to do this in my project. For example: JSON string:var jsonstr = ' {' name ': ' Nikita ', ' Password ': ' 1111 '} '; JSON object:var jsonobj = {"Name": "Nikita", "Password": "1111"};        2, string converted to json var myObject = eval (' (' + myjsontext + ') '); Eval is a function of JS, not very safe, you can consider the JSON package. "Project Combat"   I. JSON data and Easyui the DataGrid bindingsIn the evaluation system, the audio image file needs to be managed, the 1th thing to do is to display all the file list in the foreground, it has been queried and deleted operations. Through Ajax, I've got the JSON string for all the files, as shown in:

As mentioned above, JS operates on JSON objects, so it is thought that you only need to convert them to JSON objects.        But in fact, it was not successfully bound to the DataGrid.        Later on the Internet to find information, only found that the Easyui DataGrid and JSON data binding is actually a fixed parameter, the correct format should be {"Total": All, "Rows": Jsondata}. This solves the problem with the Easyui DataGrid data binding. Some of the code is as follows: Foreground HTML:
<div style= "margin-top:20px;" ><table class= "Easyui-datagrid" id= "fileList" style= "width:500px;height:500px;" data-option= "url: '/ Mongodbhelp/processrequest ' ", Fitcolumns:true >    <thead>        <tr>            <th data-options=" Field: ' CN ', width:30, checkbox: ' True ' "></th>            <th data-options=" field: ' Name ', Width:160,align: ' Center ' "> FileName </th>            <th data-options=" field: ' Size ', width:160,align: ' Center ' "> File size </th>            <th data-options= "field: ' Lastmodify ', width:220,align: ' Center '" > Last updated time </th>        </tr>    </thead></table></div>
JS method, binding data:
Get file list           function GetFiles () {                            $.ajax ({                   type: ' POST ',                   URL: '/mongodbhelp/processrequest ',                   Data: {action: "LIST", Value:null, Datestart:null, dateend:null},                   success:function (data) {                                              //alert (data); 
   var Jsondata = json.parse (data);                                          alert (jsondata);                       var datasource = {total:6, rows:jsondata}                       //alert (datasource);                                              $ (' #fileList '). DataGrid (' LoadData ', DataSource);                   },                   error:function (err) {                       alert ("error!");                   }               } );           
two. Character escaping from JSON data               In an MVC controller, convert a DataTable to JSON data that you want to display in the foreground , but getting to JSON data is not as perfect as it might seem.         Methods written in the controller that convert a DataTable to JSON and stored in the session:
Get the DataTable data that has been inserted            datatable SUCCESSDT = dicdt[0];             Datatabletojson Dtjson = new Datatabletojson ();            To do some processing of the DataTable, replace the table head with the Chinese            DataTable dt;            DT = Errordt.clone ();            Dt. Columns.remove ("Cause of Error");            DataTable dtnew = Successdt.copy ();  Copy the SUCCESSDT table data structure for            (int i = 0; i < DtNew.Rows.Count; i++)            {                dt. Rows.Add (Dtnew.rows[i]. ItemArray);  Add data row            }            //If you have correctly imported data, save the correctly imported data to the session            if (dicdt[0]! = null)            {                //datatable converted to JSON                String json = dtjson.tojson (DT);                 The JSON exists in the Session so that the foreground gets                session["successjson" = JSON;              }
In JS to get to the session, as shown: Such JSON data, must not be well recognized by the foreground, so need to be escaped, the escaped JSON data is as follows: JS code is as follows:
<script type= "Text/javascript" >         $ (document). Ready (function () {             //Get session                   var Successjson = ' @ session["Successjson"];             alert (Successjson);             To escape the JSON data             var json = successjson.replace (/"/gi," \ "");             alert (Json);          });     </script>
three. JSON Data stitching for table displayThis question comes immediately after the second question, and we are getting a well-formed JSON, and the next step is to show it to the foreground. But for these JSON data, we don't have any list collection that can host it.        Because of different types of questions, the data displayed is different, the table header is different, and the question type at least 20来 species, we can not display it to the foreground, to write a viewmodel set for each type of question, so, we use dynamic splicing table method. Think for a long time, really do not know how to get a JSON data to be stitched into a table. In the machine room and left me peace elder brother in overtime, accidentally, found an instance on the Internet, really is happiness came too suddenly.        The solution to the problem has been found, the following is the time to witness success. Found a plug-in, just a few lines of code can solve our problem. The code is as follows:
<title> Item Management--Question management </title> @* json into a table reference *@ <script type= "Text/javascript" src= ". /libs/js/jquery-1.10.2.min.js "></script> <script type=" Text/javascript "src=". /dist/jquery.jsontotable.min.js "></script> <script type=" Text/javascript "src=". /content/jquery-easyui-1.3.2/jquery.easyui.min.js "></script> @* style settings for table *@ <style>. Jsontotab        Le table,. jsontotable th,. jsontotable td {BORDER:1PX solid black;    margin:10px;  } code {white-space:normal; } </style> The effect is as follows:

JSON data processing protocol and method

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.