ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: luckduck on December 22, 2020, 02:48:18 pm

Title: How to display the select box text?
Post by: luckduck on December 22, 2020, 02:48:18 pm

Hi

I want to display the text of the selected option in the edit state when it is in the general grid state.
The options value is an array of associated value label pairs.

Code: [Select]

        var data = [
            { rank: 1, company: 'Exxon Mobil', revenues: 339938.0, profits: 36130.0 },
            { rank: 2, company: 'Wal-Mart Stores', revenues: 315654.0, profits: 11231.0 },
            { rank: 3, company: 'Royal Dutch Shell', revenues: 306731.0, profits: 25311.0 },
            { rank: 4, company: 'BP', revenues: 267600.0, profits: 22341.0 }
        ];

  var CM = [
                { title: "Rank", width: 100, dataIndx: "rank", editor: {type: "select", prepend: {"":""}, options: [{"1":"one"}, {"2": "two"}, {"3": "three"}, {"4": "four"}]} },
                { title: "Company", width: 200, dataType: "string", dataIndx: "company" },
                { title: "Revenues", width: 150, dataType: "float", dataIndx: "revenues", format: '#.0' },
                { title: "Profits", width: 150, dataType: "float", dataIndx: "profits", format: '#.0' }
            ];


Below is the link of the jsfiddle:

https://jsfiddle.net/54vucynL/

Thank you.

Title: Re: How to display the select box text?
Post by: paramvir on December 22, 2020, 03:20:21 pm

you mean to display the text instead of value of selected option in the cell?

Code: [Select]

                  getData: function(ui){
                  return ui.$cell.find("option:selected").text()
                  }

https://jsfiddle.net/kebv58yj/

Title: Re: How to display the select box text?
Post by: luckduck on January 04, 2021, 11:34:42 am

Thank you for your reply.

When generating the grid, if the data ranks 1, I want to display it as one.

And when I save, I want to save 1, not one.

Is there any possible way?

Title: Re: How to display the select box text?
Post by: paramvir on January 04, 2021, 01:15:50 pm

Yes, please use common data structure for both column.editor.options and column.render callback.

Code: [Select]

  var rank = [{
    "1": "one"
  }, {
    "2": "two"
  }, {
    "3": "three"
  }, {
    "4": "four"
  }];


Code: [Select]

      render: function(ui) {
        var obj = rank.find(function(obj) {
          return obj[ui.cellData] ? true : false;
        })
        return obj ? Object.values(obj)[0] : null;
      },


Code: [Select]

      editor: {
        type: "select",
        prepend: {
          "": ""
        },
        options: rank
      }

https://jsfiddle.net/qtypn8r0/