2

我尝试使用以下代码将占位符属性添加到输入字段,

    dataSource: {
        ...
        schema: {
            data: "storeEmployeeData",
            total: "storeEmployeeDataCount",
            model: {
                id: "ID",
                fields: {
                    Id: { type: "number", editable: false, nullable: true },
                    FirstName: { type: "string", nullable: true, editable: true, validation: { required: false } },
                    MiddleName: { type: "string", nullable: true, editable: true, validation: { required: false } },
                    LastName: { type: "string", nullable: true, editable: true, validation: { required: false } },
                    **Email: { type: "string", nullable: true, editable: true, placeholder: "(optional)", validation: { email: true, required: false } }
                }
            }
        },
        ...
    }

还尝试了以下方法,

    columns: [
        { field: "FirstName", title: "First Name", type: "string", width: "150px" }, 
        { field: "MiddleName", title: "Middle Name", type: "string", width: "150px" }, 
        { field: "LastName", title: "Last Name", type: "string", width: "150px" }, 
        { field: "Email", title: "Email", type: "string", width: "250px", sortable: false, placeholder: "(optional)" }, 
        { command: ["edit", "destroy"], title: " ", width: "200px" }
    ],

它们都没有产生我正在寻找的结果,即placeholder="(optional)"在输入字段中添加了占位符属性。

这是 HTML5 的一部分,如果 Kendo UI Grid 中已经存在此功能,它是否也与 IE 7 和 IE 8 兼容?

我错过了什么吗?任何帮助表示赞赏!

4

2 回答 2

3

Kendo UI 模型文档中没有placeholder选项;因此,不直接支持它。参考:http ://docs.kendoui.c​​om/api/framework/model#configuration-Example 。也许你打算使用defaultValue

或者,您可以使用attributesKendo UI Grid 配置的选项。参考:http ://docs.kendoui.c​​om/api/web/grid#configuration-columns.attributes 。

placeholder属性仅在 IE 10 及更高版本中受支持。

更新:(由于评论)

举个例子,为了将placeholder属性添加到输入元素,您可以使用editor列上的选项。

columns: [
  { field: "Email", title: "Email", width: 250, sortable: false, 
    editor: function (container, options) {
     var input = $("<input/>");
     input.attr("name", options.field);
     input.attr("placeholder", "(optional)");
     input.appendTo(container);
    }
  }
]
于 2013-08-26T18:27:10.793 回答
0

如果您正在寻找没有记录时的占位符,

   <div id="grid"></div>
    <script>
    $("#grid").kendoGrid({
      columns: [
        { field: "name" },
        { field: "age" }
      ],
      noRecords: true,
      dataSource: []
    });
    </script>

或者

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  pageable: true,
  noRecords: {
    template: "No data available on current page. Current page is: #=this.dataSource.page()#"
  },
  dataSource: {
    data: [{name: "John", age: 29}],
    page: 2,
    pageSize: 10
  }
});
</script>
于 2019-09-16T18:33:54.177 回答