jqGrid:使用函数的返回值构造postData数组 [英] jqGrid: construct postData array using a function's return value

问题描述

晚上好

初始情况

现在在创建网格时，我使用静态参数将参数传递给服务器，例如:

  var $grid = jQuery("#grid-table").jqGrid({
    url: '?c=grid.skill.GridSkill&json&o=get-data&type=1',
    postData: {
      'person_ref': function () { return $('#filter-person_ref').val();},
      'country_ref': function () { return $('#filter-country_ref').val(); },
    },
    mtype: 'POST',
    datatype: "json",
    colNames: self.columnTitles,
    colModel: self.columnNames,
    ...
  });

使用复杂的过滤器机制(在jqGrid控件之外)很难维护.

---

所需方法

我尝试使用函数调用来设置postData值，而不是使用静态方法:

/**
 * extract filter data from LeftBar additionally to the person filter
 */
self.preparePostData = function () {
  var arrPostData = {};

  // retrieve values from select boxes ...
  for (var i in LeftBar.arrAdditionalFilter) {
    arrPostData[LeftBar.arrAdditionalFilter[i].field] = $('#' + LeftBar.arrAdditionalFilter[i].inputField).val();
  }

  // ... and add checkbox values
  for (var i in LeftBar.arrCheckBoxFilter) {
    arrPostData[LeftBar.arrCheckBoxFilter[i].field] = $('#' + LeftBar.arrCheckBoxFilter[i].inputField).is(':checked') ? 1 : 0;
  }
  console.log(arrPostData);
  return arrPostData;
};

self.performLayout = function () {
  var $grid = jQuery("#grid-table").jqGrid({
    url: '?c=grid.skill.GridSkill&json&o=get-data&type=' + PageControl.skillTypeRef,
    postData: function () {
      return self.preparePostData();
    },
    mtype: 'POST',
    datatype: "json",
    colNames: self.columnTitles,
    colModel: self.columnNames,
    ...
  });

---

修改先前的方法

如果我使用该函数进行尝试，它将永远不会执行，因此我使用了如下的试错"方法:

...
  postData: {'data': function() { 
    return self.preparePostData();
  }},

它将提供数据:[对象对象]"作为POST参数.

解决方案

如上所述，在处理数据并尝试不同的方法的同时，它帮助我找到了解决方案，我希望值得分享.

---

我的解决方案

在记下这个问题并四处游玩时，我找到了解决自己问题的方法:-)无论如何，我都会完成它，以供将来的读者寻找类似的方法，并希望了解更好的方法.

我正在使用基于PHP的Web服务来生成网格数据，最终给我提供了所需的帖子数据是:

<?php
// NOTICE: debug code / contains demo statements from my tests

$objData= json_decode($_POST['data']);

// will give you an object of type StdClass ...
if ($objData) {

  // ... but instead of using dynamic property access like '$obj->{$field}'
  // convert it to a standard array, use it like using '$_POST' variables
  try {
    $arrPostFilter= get_object_vars($objData);
    print 'Hello Country-Ref: '.$arrPostFilter['country_ref'];
  } catch (Exception $ex) {
    print 'Malformed data retrieved, error was: '.$ex->getMessage();
  }
}

感谢您读到最后并提出您的评论(因为该解决方案很糟糕，或者可能会有所帮助:-)).

Good evening,

Initial situation

right now when creating a grid I pass parameters to the server using static parameters like:

  var $grid = jQuery("#grid-table").jqGrid({
    url: '?c=grid.skill.GridSkill&json&o=get-data&type=1',
    postData: {
      'person_ref': function () { return $('#filter-person_ref').val();},
      'country_ref': function () { return $('#filter-country_ref').val(); },
    },
    mtype: 'POST',
    datatype: "json",
    colNames: self.columnTitles,
    colModel: self.columnNames,
    ...
  });

which is pretty hard to maintain when using complex filter mechanisms (outside of the jqGrid controls).

---

Desired approach

Instead of the static approach, I tried setting the postData values using a function call:

/**
 * extract filter data from LeftBar additionally to the person filter
 */
self.preparePostData = function () {
  var arrPostData = {};

  // retrieve values from select boxes ...
  for (var i in LeftBar.arrAdditionalFilter) {
    arrPostData[LeftBar.arrAdditionalFilter[i].field] = $('#' + LeftBar.arrAdditionalFilter[i].inputField).val();
  }

  // ... and add checkbox values
  for (var i in LeftBar.arrCheckBoxFilter) {
    arrPostData[LeftBar.arrCheckBoxFilter[i].field] = $('#' + LeftBar.arrCheckBoxFilter[i].inputField).is(':checked') ? 1 : 0;
  }
  console.log(arrPostData);
  return arrPostData;
};

self.performLayout = function () {
  var $grid = jQuery("#grid-table").jqGrid({
    url: '?c=grid.skill.GridSkill&json&o=get-data&type=' + PageControl.skillTypeRef,
    postData: function () {
      return self.preparePostData();
    },
    mtype: 'POST',
    datatype: "json",
    colNames: self.columnTitles,
    colModel: self.columnNames,
    ...
  });

---

Modifying the previous method

If I try it using the function it never gets executed, so I used a try-and-error approach like:

...
  postData: {'data': function() { 
    return self.preparePostData();
  }},

which will give "data: [Object object]" as POST parameter.

解决方案

As mentioned above, while struggling with the data and trying different approaches it helped me find a solution and I hope it is worth sharing.

---

My Solution

While writing this question down and playing around I found the solution to my own problem :-) I'll complete it anyway for future readers searching for a similar solution and to hopefully read about better approaches.

I am using a PHP-based web service to generate the grid data, what in the end gave me the post data I required was:

<?php
// NOTICE: debug code / contains demo statements from my tests

$objData= json_decode($_POST['data']);

// will give you an object of type StdClass ...
if ($objData) {

  // ... but instead of using dynamic property access like '$obj->{$field}'
  // convert it to a standard array, use it like using '$_POST' variables
  try {
    $arrPostFilter= get_object_vars($objData);
    print 'Hello Country-Ref: '.$arrPostFilter['country_ref'];
  } catch (Exception $ex) {
    print 'Malformed data retrieved, error was: '.$ex->getMessage();
  }
}

Thanks for reading till the end and for your comments (either because the solution is crappy or it could help :-) ).

这篇关于jqGrid:使用函数的返回值构造postData数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！