Dojo dgrid -基于网格中的另一个字段格式化字段

ldioqlga  于 2022-12-16  发布在  Dojo
关注(0)|答案(2)|浏览(133)

我正在使用dgrid,并尝试在列上使用格式化程序,但我需要该格式化程序根据另一列的值返回值。密度列的值根据它是植物还是动物而不同。我还需要自动完成此操作,而不是单击行/单元格
下面是处理dgrid的代码部分

/* Dojo  dgrid */
    var resultsGrid = declare([Grid, Selection, ColumnResizer]);
    var columns = [{
       label: "Object ID", 
       field: "OBJECTID",
       sortable: false,
       },{
        label: "Observer Name",
        field: "OBSERVER"
      }, {
        label: "Observation Date",
        field: "DAY",
        formatter: formatTimestamp
      }, {
        label: "Latitude",
        field: "LATITUDE"
      }, {
        label: "Longitude",
        field: "LONGITUDE"
      }, {
        label: "Common Name",
        field: "Q_NAME"
      }, {
        label: "Genus",
        field: "GENUS"
      }, {
        label: "Species",
        field: "SPECIES"
      }, {
        label: "Kingdom",
        field: "KINGDOM",
        formatter: numberToTextKingdom
      },{
        label: "Area",
        field: "OB_AREA",
        formatter: numberToTextArea
      }, {
        label: "Density",
        field: "OB_DENSITY",
        formatter: getDensity
      }, {
        label: "County",
        field: "COUNTY"
      }, {
        label: "State",
        field: "STATE"
      }, {
        label: "Country",
        field: "COUNTRY"
      }, {
        label: "Date Added",
        field: "ADD_DATE",
        formatter: formatTimestamp
      }];

    grid = new resultsGrid({
      bufferRows: Infinity,
      columns: columns,
      selectionMode: 'single'
    }, "grid");

    /* Formatters for Columns */

    function formatTimestamp(value) {
     var inputDate = new Date(value);
     return dojo.date.locale.format(inputDate, {
       selector: 'date',
       datePattern: 'MM/dd/yyyy'
     });
    }

    function numberToTextArea(value) {
      var outText = "";
      if (value == 0) outText = "NA";
      if (value == 1) outText = "Individual/few/several";
      if (value == 2) outText = "< 1,000 square feet (half tennis court)";
      if (value == 3) outText = "1,000 square feet to 0.5 acre";
      if (value == 4) outText = "0.5 acre to 1 acre (football field w/o end zones)";
      if (value == 5) outText = "> 1 acre";
      return outText;
    }

    function numberToTextDensityPlants(value) {
      var outText = "";
      if (value == 0) outText = "NA";
      if (value == 1) outText = "Sparse (scattered individual stems or very small stands)";
      if (value == 2) outText = "Patchy (a mix of sparse and dense areas)";
      if (value == 3) outText = "Dense (greater than 40% of the area)";
      if (value == 4) outText = "Monoculture (nearly 100% of area)";
      return outText;
    }

    function numberToTextDensityAnimal(value) {
      var outText = "";
      if (value == 0) outText = "NA";
      if (value == 1) outText = "Few (<5)";
      if (value == 2) outText = "Many (5+)";
      return outText;
    }

我一直在使用这个函数,试图让一些东西工作,但我没有运气。

var sKingdom = "";
    grid.on("dgrid-select", function (evt) {
        let cell = grid.cell(evt);
        sKingdom = cell.row.data.Kingdom;
    });

    dPlantDensities = {0:"NA", 1:"Sparse (scattered individual stems or very small stands)", 2:"Patchy (a mix of sparse and dense areas)", 3:"Dense (greater than 40% of the area)", 4:"Monoculture (nearly 100% of area)"};
    dAnimalDensities = {0:"NA", 1:"Few (<5)", 2:"Many (5+)"};

    function getDensity(event) {
        var outText = "";
        if (KINGDOM == 0) {
            if (value == 0) outText = dPlantDensities[0];
            else if (value == 1) outText = dPlantDensities[1];
            else if (value == 2) outText = dPlantDensities[2];
            else if (value == 3) outText = dPlantDensities[3];
            else if (value == 4) outText = dPlantDensities[4];
        } else {
            if (value == 0) outText = dAnimalDensities[0];
            else if (value == 1) outText = dAnimalDensities[1];
            else if (value == 2) outText = dAnimalDensities[2];
        }
        return outText;
    }

这是一个填充dgrid的示例

/* Populate DGrid Table at bottom of page with query results*/
      var items = prjResults
      var TableFeatures = []
      array.forEach(items, function (feature) {
       var TableAttributes = {}
       var TableFields = Object.keys(feature.attributes)
       for (var i = 0; i < TableFields.length; i++) {
           TableAttributes[TableFields[i]] = feature.attributes[TableFields[i]]
       }
       TableFeatures.push(TableAttributes)
      })

      var memStore = new Memory({
        data: TableFeatures,
        idProperty: "OBJECTID"
      });

      grid.set("collection", memStore);
      grid.set("sort", "OBJECTID", true) // sorts objectID column - shows most recent 1st
      grid.on("dgrid-select", selectedOBS);
      grid.on('dgrid-deselect', clearonChange);
a0zr77ik

a0zr77ik1#

可以使用renderCell函数基于行中的其他值呈现单元格。可以按如下方式指定密度列:

{
        label: "Density",
        field: "OB_DENSITY",
        renderCell: function(object, value, node) {

                    }
}

object参数包含存储区中的行,因此您可以使用它来检查物种或界。您不必指定正在使用的dgrid版本。在最新版本中,formatter函数还包括object参数。请查看文档以使用formatter或renderCell函数的正确参数:
数据网格1.2.1
坐标网格0.3

nvbavucw

nvbavucw2#

对dgrid列使用get方法,可以成功地基于另一列的值返回某些值

{
        label: "Density",
        field: "OB_DENSITY",
        get: function(obj){
          if (obj.KINGDOM == 0) {if (obj.OB_DENSITY == 0) {return "NA"};}
          if (obj.KINGDOM == 0) {if (obj.OB_DENSITY == 1) {return "Sparse (scattered individual stems or very small stands)"};}
          if (obj.KINGDOM == 0) {if (obj.OB_DENSITY == 2) {return "Patchy (a mix of sparse and dense areas)"};}
          if (obj.KINGDOM == 0) {if (obj.OB_DENSITY == 3) {return "Dense (greater than 40% of the area)"};}
          if (obj.KINGDOM == 0) {if (obj.OB_DENSITY == 4) {return "Monoculture (nearly 100% of area)"};}
          if (obj.KINGDOM == 1) {if (obj.OB_DENSITY == 0) {return "NA"};}
          if (obj.KINGDOM == 1) {if (obj.OB_DENSITY == 1) {return "Few (<5)"};}
          if (obj.KINGDOM == 1) {if (obj.OB_DENSITY == 2) {return "Many (5+)"};}
        }
      },

相关问题