Question

在我的网格中，我应该能够根据webservice返回的状态设置复选框和字符串数据。现在我正在编写自定义渲染器函数，如下所示： function customcolumn1（value，metadata，record）{

    var completedTime = record.get('nccompletedTime');
    var completedByLastName = record.get('nccompletedByLastName');
    var completedByFirstName = record.get('nccompletedByFirstName');
    if (value == 'Completed') {
        return completedTime + " " + completedByLastName + "," + completedByFirstName;
    } else if (value == 'Pending') {
        return "<input type='checkbox' disabled>";
    } else if (value == 'Assigned') {
        return "<input type='checkbox'>";
    }
}

网格是

var SAFjobgrid = Ext.create('Ext.grid.Panel', {
    store: store,
    columns: [
        {
        text: "",
        width: 30,
        renderer: customSeqNumber,
        dataIndex: 'sequenceNumber'},
    {
        text: "Task",
        width: 350,
        renderer: customTask,
        dataIndex: 'label'},
    {
        text: "Complete",
        width: 160,
        renderer: customcolumn2,
        dataIndex: 'stampActionStatus'},
    {
        text: "Verified",
        width: 160,
        renderer: customcolumn,
        dataIndex: 'verifyActionStatus'},
    {
        text: "Non Compliance",
        flex: 1,
        renderer: customcolumn1,
        dataIndex: 'ncActionStatus'}

    ]
});

现在我想检查复选框并捕获那些记录的stampIds。当我点击网格的oustside的更新按钮时，我应该可以使用捕获的stampId调用web服务。我试图把从渲染器函数返回时复选框上的onclick事件。但是如何访问该记录的stampId。如果我选择多个复选框，多个stampid应该转到webservice，如果我取消选中该复选框，则应该从stampId中删除相应的stampid。任何人都可以帮助这个..

Answer 1

您可以查看CheckColumn用户扩展程序http://docs.sencha.com/ext-js/4-1/#!/api/Ext.ux.CheckColumn但是在您的情况下，您必须覆盖此类渲染器方法

renderer : function(value, meta, record){
    var cssPrefix = Ext.baseCSSPrefix,
        cls = [cssPrefix + 'grid-checkheader'],
        completedTime = record.get('nccompletedTime'),
        completedByLastName = record.get('nccompletedByLastName'),
        completedByFirstName = record.get('nccompletedByFirstName');

    if (value == 'Completed') {
        //render string instead of checkbox
        return Ext.String.format('{0} {1},{2}', completedTime, completedByLastName, completedByFirstName);
    }

    if (value === 'Assigned') {
        cls.push(cssPrefix + 'grid-checkheader-checked');
    }
    //render checkbox stub, 
    //it is actually a div element with special css classes to simulate checkbox
    return '<div class="' + cls.join(' ') + '">&#160;</div>';
}

要收集已检查/未检查的行，您可以使用此商店方法http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.AbstractStore-method-getUpdatedRecords 它返回通过选中/取消选中此列更新的模型数组

一列有字符串数据和extjs4.1中的复选框

1 个答案: