jquery - JQuery中如何为选中的行添加css

Question

我在一个 div 中有一个 html 网格。这个网格有一个可编辑的列，查询是当我们用正确的数据对其进行编辑时，有红色图像显示，这是不应该显示的。

为此创建了一个 css 类:

#divPromotionExceptions .errorRemove {    
    background-image:none;
}

然后在js文件中把下面的代码放在

saveClick() {
     if (success) {
        $('.x-grid3-dirty-cell').addClass('errorRemove');
    }
    else {
        if ($('.x-grid3-dirty-cell').hasClass('errorRemove')) {
            $('.x-grid3-dirty-cell').removeClass('errorRemove');
        }
    }

查询是我的代码删除所有行的图像并将其添加在一起，同时我需要逐行应用。

注意:如果网格有三行，那么它有三个 div 和相应的表格。下面是 html 网格:

       grid = new Ext.grid.GridPanel({
       store: promotionExceptionStore,
       width: ($$('divPromotionExceptions').width() - 5),
       stripeRows: true,
       height: 225,
    region: 'center',
    margins: '0 5 5 5',
    plugins: [editor],
    columnLines: true,
    columns: [
    new Ext.grid.RowNumberer(),
     {
         id: 'Action',
         dataIndex: 'Action',
         header: 'Actions',
         width: 100,
         sortable: false,
         readOnly: true,
         renderer: LinkRenderer,
         tooltip: 'Actions'
         },
        {
         id: 'OfficeNumber',
        dataIndex: 'OfficeNumber',
        header: 'Office',
        width: 50,
        sortable: true,
        tooltip: 'Branch Number'
    },
     {
         id: 'AccountNumber',
         dataIndex: 'AccountNumber',
         header: 'Account',
         width: 60,
         sortable: true,
         tooltip: 'Account Number'
     },
        {
          id: 'FANumber',
          dataIndex: 'FANumber',
          header: 'FA',
          width: 50,
         sortable: true,
         tooltip: 'FA Number'
     },
    {
        id: 'Name',
        header: 'Client Name',
        dataIndex: 'Name',
        width: 220,
        sortable: true,
        tooltip: 'Name'
    },
    {
        xtype: 'numbercolumn',
        header: 'Exception Amount($)',
        dataIndex: 'Amount',
        width: 150,
        sortable: true,
        tooltip: 'Exception Amount($)',
        format: '0,000',

        editor: {
            allowBlank: false,
            //                maxLength: 13,
            minValue: 1,
            autoCreate: { tag: 'input', type: 'text', size: '20', autocomplete: 'off', maxlength: 13 },
            vtype: 'currencycheck',
            validationDelay: 100,
            listeners: {
                'render': function(c) {
                    var currentId = c.getEl().id;
                    $$(currentId).attr('maxlength', '13');
                    //$$(currentId).bind("cut copy paste", function(e) {    e.preventDefault(); });
                    $$(currentId).preventString();  //SKB Change
                    $$(currentId).maskMoney({ symbol: "", precision: 0 });
                },
                'focus': function(c) {
                    var currentId = c.getEl().id;
                    if ($$(currentId).val() != '') {
                        $$(currentId).format({ format: "#,###", locale: "us" });
                    }
                },
                'blur': function(c) {

                    var currentId = c.getEl().id;
                    var currentValue = $$(currentId).val();
                    currentValue = currentValue.replace(/,/g, '');
                    $$(currentId).val(currentValue);
                    //$$(currentId).unmaskMoney();

                },
                'beforestaterestore': function(c, d) {
                }
             }
          }
       },
    {
        xtype: 'numbercolumn',
        id: 'AmountUsed',
        header: 'Exception Amount Used($)',
        dataIndex: 'AmountUsed',
        width: 180,
        sortable: true,
        format: '0,000',
        tooltip: 'Exception Amount Used($)'

       },
       {
        xtype: 'numbercolumn',
        id: 'HHAssets',
        dataIndex: 'HHAssets',
        header: 'HHAssets ($)',
        width: 180,
        sortable: true,
        format: '0,000',
        tooltip: 'House Holding Assets($)'
      },
      {
        xtype: 'numbercolumn',
        id: 'Trailing12MonthsRevenue',
        dataIndex: 'Trailing12MonthsRevenue',
        header: 'Trailing 12 Months Revenue($)',
        width: 150,
        sortable: true,
        format: '0,000',
        tooltip: 'Account Revenue($)'
       },
       {
        xtype: 'numbercolumn',
        id: 'CommissionRevenue',
        dataIndex: 'CommissionRevenue',
        header: 'Commission Revenue($)',
        width: 150,
        sortable: true,
        format: '0,000',
        tooltip: 'HouseHold Revenue($)'
        },
        {
        header: 'KeyAccount',
        dataIndex: 'KeyAccount',
        width: 200,
        sortable: true,
        //hidden: true,
        //menuDisabled: true,
        tooltip: 'KeyAccount'
        }

        ]

       });

和保存按钮:

    <asp:LinkButton ID="lnkSave" runat="server" PostBackUrl="#"  OnClientClick="saveClick(); window.returnValue=false; return false;" >

提前致谢。

Answer 1

<asp:LinkButton ID="lnkSave" runat="server" PostBackUrl="#"  OnClientClick="saveClick(this); window.returnValue=false; return false;" >

将 this 传递给点击处理程序 saveClick(this)。

假设按钮在 td 内，而 td 在 tr 内。因为你想改变 row 的类。

在你的保存中点击使用

saveClick(target) {
     var $activeTr = $(target).closest('tr');
     if (success) {
        $activeTr.addClass('errorRemove');
    }
    else {
        if ($activeTr.hasClass('errorRemove')) {
            $activeTr.removeClass('errorRemove');
        }
    }