jqGrid以setGridParam方式postData,包含历史数据的问题

  系统在使用jqGrid时,如果某些页面的查询项是复选框,后台是数组接收的,就会出现传值不正确问题。

1、项目中某查询页面存在的复选框:待处理S1,正在处理S2,已处理S3;

使用jqGrid提交查询数据方法如下:

$("#xxTable").setGridParam({

  datatype : "json",
  postData: {
    "id" : $("#id").val(),
    "nodeStatus" : checkBoxValues("nodeStatus")
   }
  }).trigger("reloadGrid", [{ page: 1}]);

2、该问题调查如下:

  第一次传值:id传123456,勾选待处理

postData: id:123456  , nodeStatus : [S0]
       第二次传值:id传1234567,勾选正在处理
       postData:id :1234567 , nodeStatus : [S1]
       第三次传值:勾选待处理、正在处理
       postData:nodeStatus : [S0, S1]
       第四次传值:勾选待处理、已处理
       postData:nodeStatus : [S0, S2]
       第五次传值:勾选待处理、正在处理、已处理
       postData:nodeStatus : [S0, S1, S2]
       第六次传值:勾选正在处理、已处理
       postData:nodeStatus : [S1, S2, S2]
       第七次传值:勾选待处理、已处理
       postData:nodeStatus : [S0, S2, S2]
       第八次传值:勾选已处理
       postData:nodeStatus : [S2, S2, S2]

  不难发现,它会启用上次提交的历史数据,并将本次提交的数据对应替换,如果是单个值还好,如果是数组那么就会出现问题。  

3、解决该问题方式:

  A、在jqGrid内使用serializeGridData 事件,此事件返回一个要传到后台的序列化数据,这里进行重新赋值后返回发到后台:

serializeGridData : function (postData)

{

postData.nodeStatus=checkBoxValues("nodeStatus");

return JSON.stringify(postData);

},

   此方法有一个弊端,就是不能一劳永逸,如果后期查询页面又新增了一个复选框查询项,那么记得一定要在此处重新赋值。

  B、简单粗暴的方法,每次请求前都将历史数据清除掉:

    var postData = $("#xxTable").jqGrid("getGridParam", "postData");

    $.each(postData, function (k, v) {

      delete postData[k];

    });

    此方法可以提炼为一个公共方法使用。

原文地址:https://www.cnblogs.com/xStarMoony/p/11401889.html

时间: 2024-08-30 02:30:18

jqGrid以setGridParam方式postData,包含历史数据的问题的相关文章

Java Array数组 遍历 四种方式(包含 Lambda 表达式遍历)

package com.hello; import java.util.Arrays; /** * @Author Miracle Luna * @Date 2019/6/9 23:33 * @Version 1.0 */public class ArrayLambda { public static void main(String[] args) { Integer[] items = { 1, 2, 3 }; // 普通for循环遍历 System.out.println("第一种方式:普

List集合 遍历 四种方式(包含 Lambda 表达式遍历)

示例代码如下: package com.miracle.luna.lambda; import java.util.ArrayList; import java.util.List; /** * @Author Miracle Luna * @Date 2019/6/9 23:36 * @Version 1.0 */ public class ListLambda { public static void main(String[] args) { List<String> items = n

Spring学习之使用标签来标记资源(@Component、@Repository、 @Service和@Controller)以及使用方式(包含如何在jsp中使用)

首先要在xml文件当中加入标下划线的部分,容器初始化时候需要扫描的包 注意: a.     扫描的包部分(下划线部分)一定要加上,默认是不会扫描所有的包的.各个包之间用','隔开.如过具有相同的父包,那么我们可以用父包来代替.如下划线部分,我们可以用com.bjsxt来代替. <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.or

JqGrid相关操作备忘 方法列表

JqGrid相关操作备忘 方法列表 1.获得当前列表行数:$("#gridid").getGridParam("reccount"); 2.获取选中行数据(json):$("#gridid").jqGrid('getRowData', id); 3.刷新列表:$(refreshSelector).jqGrid('setGridParam', { url: ''), postData: ''}).trigger('reloadGrid'); 4.选

jqGrid行编辑配置

jqGrid行编辑配置,方法,事件 行编辑可以在行修改后更新数据,如下图所示 用户用鼠标点击选择一行,jqGrid将可编辑的字段转换为数据输入单元,如上面图所示.不可编辑的列,如id,不会转为可输入单元,而是保持不变.可以通过配置colModel来实现.完成修改后,按下"enter"键提交数据到服务器. 软件要求和安装 要使用行编辑功能,需要在jqGrid下载页面勾选Inline Editing和Common modules,然后下载.下载地址:http://www.trirand.c

【APS.NET Core】- Razor Page 使用jqgrid实现分页功能

本文将使用jqgrid在Razor Page中实现分页功能. 前台 List.cshtml代码如下: 1 @page 2 @model ListModel 3 @{ 4 Layout = "~/Pages/Shared/_Index.cshtml"; 5 } 6 7 <script> 8 $(function () { 9 gridList(); 10 }); 11 12 function gridList() { 13 var $gridList = $("#g

jqGrid行编辑配置,方法,事件

行编辑可以在行修改后更新数据,如下图所示 用户用鼠标点击选择一行,jqGrid将可编辑的字段转换为数据输入单元,如上面图所示.不可编辑的列,如id,不会转为可输入单元,而是保持不变.可以通过配置colModel来实现.完成修改后,按下“enter”键提交数据到服务器. 软件要求和安装 要使用行编辑功能,需要在jqGrid下载页面勾选Inline Editing和Common modules,然后下载.下载地址:http://www.trirand.com/blog/?page_id=6 要看元代

jQuery学习笔记--JqGrid相关操作 方法列表(上)

1.获得当前列表行数:$("#gridid").getGridParam("reccount"); 2.获取选中行数据(json):$("#gridid").jqGrid('getRowData', id); 3.刷新列表:$(refreshSelector).jqGrid('setGridParam', { url: ''), postData: ''}).trigger('reloadGrid'); 4.选中行:$("#jqGrid

tab页以及jqgrid某些用法参考记录

<%@ Page Language="C#" AutoEventWireup="True" CodeBehind="CcrCreditHumanAssessEdit.aspx.cs" Inherits="HraWeb.CcrCreditHumanAssessEdit" %><%@ Import Namespace="HraModel.Sys.Enum" %> <!DOCTYPE