Kendo ui grid:根据行改变字段类型

时间:2015-11-24 18:04:40

标签: javascript angularjs json kendo-ui

我有一个我不知道怎么买的问题。我有一个kendo网格,其中包含一个json文件。

问题是在json文件中有一个字段在不同的元素中有不同的类型。

我将用一个例子解释自己:

"listaPreguntas": [
    {
        "idPregunta": 1126,
        "idTipificacion": 1712,
        "tipoPregunta": "E",
        "pregunta": "¿DE QUE COLOR ES?",
        "numeroOrden": 2,
        "respuestasPosibles": [
            {
                "idRespuestaPosible": 1066,
                "respuestaPosible": "HOSPITAL"
            },
            {
                "idRespuestaPosible": 1068,
                "respuestaPosible": "AMBULATORIO"
            },
            {
                "idRespuestaPosible": 1070,
                "respuestaPosible": "CENTRO SALUD"
            },
            {
                "idRespuestaPosible": 1072,
                "respuestaPosible": "UNIDAD MOVIL"
            },
            {
                "idRespuestaPosible": 1074,
                "respuestaPosible": "UNIDAD DONACION"
            },
            {
                "idRespuestaPosible": 1076,
                "respuestaPosible": "UNIDAD MOVIL (UVI)"
            }
        ],
        "idTipoEnumerado": 1
    },
    {
        "idPregunta": 1150,
        "idTipificacion": 1712,
        "tipoPregunta": "T",
        "pregunta": "¿cuantas personas?",
        "numeroOrden": 1,
        "respuestasPosibles": null,
        "idTipoEnumerado": 0
    },
    {
        "idPregunta": 1152,
        "idTipificacion": 1712,
        "tipoPregunta": "F",
        "pregunta": "¿Mayores?",
        "numeroOrden": 3,
        "respuestasPosibles": null,
        "idTipoEnumerado": 0
    }

你可以在json文件中看到三个对象,第一个对象有一个类型" E"并且具有六个可能的值,第二个对象具有类型" T" (文本),最后一个是布尔值。

我需要的是在网格中显示一个类型根据json类型改变的列。在某些情况下我需要一个文本值,一个复选框和一个下拉框。

我希望你能理解我。

提前致谢。

2 个答案:

答案 0 :(得分:0)

以下是http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.editor

中自定义编辑器的示例
$("#grid").kendoGrid({
  columns: [ {
    field: "name",
    editor: function(container, options) {
     var input = $("<input/>");
     input.attr("name", options.field);
     input.appendTo(container);

     if(options.model.tipoPregunta == 'E')
     {
         input.kendoDropDownList( ... );
     }
     if(options.model.tipoPregunta == 'T')
     {
          ....
     }
     if(options.model.tipoPregunta == 'F')
     {
          ....
     }
    }
  } ],
  editable: true,
  dataSource: [ { name: "Jane Doe" }, { name: "John Doe" } ]
});

options.model是一行dataItem

答案 1 :(得分:0)

您只需在网格配置中为列创建模板:

org.apache.commons.lang3.tuple.ImmutablePair