ホームページ > 記事 > ウェブフロントエンド > Ajax や Easyui などのフレームワークを使用する場合の Json-lib 処理ソリューション (グラフィックチュートリアル)

Ajax や Easyui などのフレームワークを使用する場合の Json-lib 処理ソリューション (グラフィックチュートリアル)

亚连オリジナル: 2018-05-22 11:13:331427ブラウズ

この記事では主に、ajax や easyui などのフレームワークを使用する場合の Json-lib 処理ソリューションを紹介します。必要な方は参考にしてください。

ajax や easyui などのフレームワークを使用する場合でも、バックエンドがフロントエンドにデータを出力するときに json が関与します。この問題に対処するには、json を手動で設定する方法と、json-lib を使用する方法の 2 つを紹介します。通常の手動設定方法はフィールド名に応じて 1 つずつ設定する必要があるため、他のオブジェクトでは使用できず、コードの再利用性が低下します。json-lib ツールを使用すると、自動化を実現できます。

方法 1: 手動で構成を変更するプロセスにより、処理効率とコードの再利用性が大幅に向上しました。 easyuiリクエストメソッドを例に挙げると、フロントデスクはdategridを使用します。データには共通のフィールド（int、String）データと日付（date）データがあります:

<table id="dg" title="用户管理" class="easyui-datagrid"
 fitColumns="true" pagination="true" rownumbers="true"
 url="${pageContext.request.contextPath}/user_list.action" fit="true" toolbar="#tb">
 <thead>
 <tr>
  <th field="cb" checkbox="true" align="center"></th>
  <th field="id" width="50" align="center">编号</th>
  <th field="trueName" width="80" align="center">真实姓名</th>
  <th field="userName" width="80" align="center">用户名</th>
  <th field="password" width="80" align="center">密码</th>
  <th field="sex" width="50" align="center">性别</th>
  <th field="birthday" width="100" align="center">出生日期</th>
  <th field="identityId" width="130" align="center">身份证</th>
  <th field="email" width="120" align="center">邮件</th>
  <th field="mobile" width="80" align="center">联系电话</th>
  <th field="address" width="100" align="center">家庭地址</th>
 </tr>
 </thead>
</table>

*。 ************************************************** ****************** ******************************* ******************* ****************************** ********

アクションレイヤー:

public void list()throws Exception{
 PageBean pageBean=new PageBean(Integer.parseInt(page), Integer.parseInt(rows));
 List<User> userList=userService.findUserList(s_user, pageBean);
 Long total=userService.getUserCount(s_user);
 JSONObject result=new JSONObject();
 JSONArray jsonArray=JsonUtil.formatUserListToJsonArray(userList);
 //easyui接收属性为rows（数据内容）和total（总记录数）
 result.put("rows", jsonArray);
 result.put("total", total);
 //获取response对象
 ResponseUtil.write(ServletActionContext.getResponse(), result);
}

******* ************************** ************************ ************************* ************************* ************************ ********************

util ツール:

public class JsonUtil {
  /**
   * 将List结果集转化为JsonArray
   * @param gradeService
   * @param stuList
   * @return
   * @throws Exception
   */
  public static JSONArray formatUserListToJsonArray(List<User> userList)throws Exception{
    JSONArray array=new JSONArray();
    for(int i=0;i<userList.size();i++){
      User user=userList.get(i);
      JSONObject jsonObject=new JSONObject(); 
      jsonObject.put("userName", user.getUserName());   //需手动逐个配置json的key-code
      jsonObject.put("password", user.getPassword());
      jsonObject.put("trueName", user.getTrueName());
      jsonObject.put("sex", user.getSex());
      jsonObject.put("birthday", DateUtil.formatDate((user.getBirthday()), "yyyy-MM-dd"));
      jsonObject.put("identityId", user.getIdentityId());
      jsonObject.put("email", user.getEmail());
      jsonObject.put("mobile", user.getMobile());
      jsonObject.put("address", user.getAddress());
      jsonObject.put("id", user.getId());
      array.add(jsonObject);
    }
    return array;
  }
}

方法 2: jsonLib ツールを使用して処理を完了する例として、easyui のリクエストメソッドを挙げます。デスクは dategrid を通じてバックエンドから製品リストデータを要求します。データには通常のフィールド (int、String) データだけでなく、日付 (date) データも含まれています。同時に、製品オブジェクト (Product) もカスケードされます。カテゴリオブジェクト (ProductType)

jsp ページ:

<table id="dg" title="商品管理" class="easyui-datagrid"
fitColumns="true" pagination="true" rownumbers="true"
 url="${pageContext.request.contextPath}/product_list.action" fit="true" toolbar="#tb">
 <thead>
 <tr>
 <th field="cb" checkbox="true" align="center"></th>
 <th field="id" width="50" align="center" hidden="true">编号</th>
 <th field="proPic" width="60" align="center" formatter="formatProPic">商品图片</th>
 <th field="name" width="150" align="center">商品名称</th>
 <th field="price" width="50" align="center">价格</th>
 <th field="stock" width="50" align="center">库存</th>
 <th field="smallType.id" width="100" align="center" formatter="formatTypeId" hidden="true">所属商品类id</th>
 <th field="smallType.name" width="100" align="center" formatter="formatTypeName">所属商品类</th>
 <th field="description" width="50" align="center" hidden="true">描述</th>
 <th field="hotTime" width="50" align="center" hidden="true">上架时间</th>
 </tr>
 </thead>
</table>

*********************************** ************************************************* * ************************************************ ** ************************

アクションレイヤー:

public void list() throws Exception{
 PageBean pageBean=new PageBean(Integer.parseInt(page),Integer.parseInt(rows));
 List<Product> productList=productService.getProducts(s_product, pageBean);
 long total=productService.getProductCount(s_product);
 
 //使用jsonLib工具将list转为json
 JsonConfig jsonConfig=new JsonConfig();
 jsonConfig.setExcludes(new String[]{"orderProductList"}); //非字符串对象不予处理
 jsonConfig.registerJsonValueProcessor(java.util.Date.class, new DateJsonValueProcessor("yyyy-MM-dd")); //处理日期
 jsonConfig.registerJsonValueProcessor(ProductType.class,new ObjectJsonValueProcessor(new String[]{"id","name"}, ProductType.class)); //处理类别list对象
 JSONArray rows=JSONArray.fromObject(productList, jsonConfig);
 JSONObject result=new JSONObject();
 result.put("rows", rows);
 result.put("total", total);
 ResponseUtil.write(ServletActionContext.getResponse(), result);
}

**************** ******** ***************************************** ********* **************************************** ********** ********************************

ユーティリティツール:

/**
 * json-lib 日期处理类
 * @author Administrator
 *
 */
public class DateJsonValueProcessor implements JsonValueProcessor{
 private String format; 
 
  public DateJsonValueProcessor(String format){ 
    this.format = format; 
  } 
 public Object processArrayValue(Object value, JsonConfig jsonConfig) {
 // TODO Auto-generated method stub
 return null;
 }
 public Object processObjectValue(String key, Object value, JsonConfig jsonConfig) {
 if(value == null) 
    { 
      return ""; 
    } 
    if(value instanceof java.sql.Timestamp) 
    { 
      String str = new SimpleDateFormat(format).format((java.sql.Timestamp)value); 
      return str; 
    } 
    if (value instanceof java.util.Date) 
    { 
      String str = new SimpleDateFormat(format).format((java.util.Date) value); 
      return str; 
    } 
    return value.toString(); 
 }
}
/**
 * 解决对象级联问题
 * @author Administrator
 *
 */
public class ObjectJsonValueProcessor implements JsonValueProcessor{
 /**
 * 保留的字段
 */
 private String[] properties; 
 
 /**
 * 处理类型
 */
 private Class<?> clazz; 
 
 /**
 * 构造方法 
 * @param properties
 * @param clazz
 */
 public ObjectJsonValueProcessor(String[] properties,Class<?> clazz){ 
    this.properties = properties; 
    this.clazz =clazz; 
  } 
 
 public Object processArrayValue(Object arg0, JsonConfig arg1) {
 // TODO Auto-generated method stub
 return null;
 }
 public Object processObjectValue(String key, Object value, JsonConfig jsonConfig) {
 PropertyDescriptor pd = null; 
    Method method = null; 
    StringBuffer json = new StringBuffer("{"); 
    try{ 
      for(int i=0;i<properties.length;i++){ 
        pd = new PropertyDescriptor(properties[i], clazz); 
        method = pd.getReadMethod(); 
        String v = String.valueOf(method.invoke(value)); 
        json.append("&#39;"+properties[i]+"&#39;:&#39;"+v+"&#39;"); 
        json.append(i != properties.length-1?",":""); 
      } 
      json.append("}"); 
    }catch (Exception e) { 
      e.printStackTrace(); 
    } 
    return JSONObject.fromObject(json.toString()); 
 }
}

上記は皆さんのためにまとめたものです。将来的には皆さんのお役に立てれば幸いです。

JSでAjaxリクエスト関数を実装する方法

phpブートストラップ

ajaxフォーム送信

ajax簡単なリアルタイム検証機能を実装

以上がAjax や Easyui などのフレームワークを使用する場合の Json-lib 処理ソリューション (グラフィックチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：React のさまざまなバージョンでのルーティングジャンプ方法のまとめ次の記事：React のさまざまなバージョンでのルーティングジャンプ方法のまとめ

続きを見る

Ajax や Easyui などのフレームワークを使用する場合の Json-lib 処理ソリューション (グラフィック チュートリアル)

関連記事

Ajax や Easyui などのフレームワークを使用する場合の Json-lib 処理ソリューション (グラフィックチュートリアル)