Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6208

How to hide a hyperlink available in antd table column?

$
0
0

I am using Antd Editable Rows table in typescript(Ref:https://beta.ant.design/components/table/#components-table-demo-edit-row) I have included checkbox column as well for the table. Now my requirement is, if any one of the checkbox is checked, then Edit hyperlink( tag with id ='anchorEdit') will be enabled. If more than one checkbox is checked, then Edit hyperlink will be disabled/ hidden. Code to display the Edit hyperlink is as below:

this.columns = [{
  title: 'name',
  dataIndex: 'name',
  width: '25%',

}, {
  title: 'age',
  dataIndex: 'age',
  width: '15%',

}, {
  title: 'address',
  dataIndex: 'address',
  width: '40%',

}, {
      title: 'operation',
      dataIndex: 'operation',
      render: (text, record) => {
        //let anchorID = 'anchorEdit'+record.ID;
        const { editingKey } = this.state;
        const editable = this.isEditing(record);
        return editable ? (
          <span>
             <EditableContext.Consumer>
              {form => (
                <a
                  onClick={() => this.save(form, record.ID)}
                  style={{ marginRight: 8 }}
                >
                  Save
                </a>
              )}
            </EditableContext.Consumer> 
            <Popconfirm title="Sure to cancel?" onConfirm={() => this.cancel(record.ID)}>
              <a>Cancel</a>
            </Popconfirm>
          </span>
        ) : (<a className='display' id='anchorEdit' onClick={() => this.edit(record.ID)}>Edit</a>);
    );
  },
}];

please help to do the changes? Thanks in Advance!


Viewing all articles
Browse latest Browse all 6208

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>