如何获取 YUI DataTable 中复选框的选中状态并由数据源中的数据设置？

发布于 2024-09-30 20:57:39 字数 1196 浏览 6 评论 0原文

我一整天都在谷歌上搜索这个问题，似乎找不到答案。当然也在这里搜索过，也没有找到，但是如果我在某个地方错过了答案，请原谅我。我确实尝试过！

我有一个包含 CheckBox 字段的 YUI DataTable。我希望根据我用作表的数据源的传入 JSON 数据来选中或取消选中此框。发生的情况是，所有行的复选框都被选中，并且我不知道该怎么做才能告诉它仅在字段值为“true”时才选中该框。这是我现在的代码：

createDataTable : function (data) {
        var columnDefs =  [
                            { key: "Well", width : 30 },
                            { key: "Value", field: "ReducedValue", width : 100 },
                            { key: "Hit", width : 30, formatter:YAHOO.widget.DataTable.formatCheckbox},
                            { key: "Reason", field: "reason", width : 200 }                                
                          ];
        var dataSource = new YAHOO.util.DataSource(data);
        dataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
        dataSource.responseSchema = {
          fields : [ "Well", "ReducedValue", "Hit", "reason" ]
        };

        var dataTable = new YAHOO.widget.ScrollingDataTable("data-table", columnDefs, dataSource, {height:"10em"});
        $(".yui-dt table").css( { width : imageW } );

      }

“Hit”字段是我在这里关心的字段。该字段值为“true”的传入数据应选中该复选框，否则应取消选中该复选框。

感谢您的帮助！

威廉

原文

I've been googling this all day and can't seem to find an answer. Also searched here of course, and also didn't find it, but please forgive me if I've missed the answer somewhere. I did try!

I have a YUI DataTable that contains a CheckBox field. I would like to have this box checked or unchecked based in the incoming JSON data that I'm using as the DataSource for the table. What's happening is that the checkbox is checked for all rows, and I don't know what to do to tell it to only check the box if the field value is 'true'. Here's my code as of now:

createDataTable : function (data) {
        var columnDefs =  [
                            { key: "Well", width : 30 },
                            { key: "Value", field: "ReducedValue", width : 100 },
                            { key: "Hit", width : 30, formatter:YAHOO.widget.DataTable.formatCheckbox},
                            { key: "Reason", field: "reason", width : 200 }                                
                          ];
        var dataSource = new YAHOO.util.DataSource(data);
        dataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
        dataSource.responseSchema = {
          fields : [ "Well", "ReducedValue", "Hit", "reason" ]
        };

        var dataTable = new YAHOO.widget.ScrollingDataTable("data-table", columnDefs, dataSource, {height:"10em"});
        $(".yui-dt table").css( { width : imageW } );

      }

The 'Hit' field is the one I'm concerned with here. Incoming data with a value of 'true' for this field should have the checkbox checked, otherwise it should be unchecked.

Thanks for any help!

William

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

若言繁花未落 2024-10-07 20:57:39

formatCheckbox 的实际代码如下。我只是猜测，但也许您传入的字符串“false”或字符串“0”实际上是 true 值。

 /**
     * Formats a CHECKBOX element.
     *
     * @method DataTable.formatCheckbox
     * @param el {HTMLElement} The element to format with markup.
     * @param oRecord {YAHOO.widget.Record} Record instance.
     * @param oColumn {YAHOO.widget.Column} Column instance.
     * @param oData {Object | Boolean} Data value for the cell. Can be a simple
     * Boolean to indicate whether checkbox is checked or not. Can be object literal
     * {checked:bBoolean, label:sLabel}. Other forms of oData require a custom
     * formatter.
     * @static
     */
    formatCheckbox : function(el, oRecord, oColumn, oData) {
        var bChecked = oData;
        bChecked = (bChecked) ? " checked=\"checked\"" : "";
        el.innerHTML = "<input type=\"checkbox\"" + bChecked +
                " class=\"" + DT.CLASS_CHECKBOX + "\" />";
    },

The actual code for formatCheckbox is below. I'm just guessing, but maybe you're passing in the string 'false' or the string '0' which are actually true in value.

 /**
     * Formats a CHECKBOX element.
     *
     * @method DataTable.formatCheckbox
     * @param el {HTMLElement} The element to format with markup.
     * @param oRecord {YAHOO.widget.Record} Record instance.
     * @param oColumn {YAHOO.widget.Column} Column instance.
     * @param oData {Object | Boolean} Data value for the cell. Can be a simple
     * Boolean to indicate whether checkbox is checked or not. Can be object literal
     * {checked:bBoolean, label:sLabel}. Other forms of oData require a custom
     * formatter.
     * @static
     */
    formatCheckbox : function(el, oRecord, oColumn, oData) {
        var bChecked = oData;
        bChecked = (bChecked) ? " checked=\"checked\"" : "";
        el.innerHTML = "<input type=\"checkbox\"" + bChecked +
                " class=\"" + DT.CLASS_CHECKBOX + "\" />";
    },

回复收藏 0 原文

~没有更多了~