Question

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

Answer 1

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 + "\" />";
    },