2016-09-02 3 views
5

Как отредактировать таблицу непосредственно на странице браузера и сохранить данные после перегрузки страницы. Таблица сделана с использованием реакции bootstrap table.screenshot проекта здесь. edit and save like in screenshotКак отредактировать реакцию загрузочной таблицы и сохранить данные после редактирования

код моего проекта здесь.

onAfterSaveCell(value, name){ 
axios({ 
method:'post', 
url:'https://something.something.com.somewhere/update_something', 
headers: { 
'Accept': 'application/json', 
'Content-Type': 'application/json', 
'x-access-token':this.state.token 
}, 
data:{ 
name:value[name] 
} 
}) 
.then((response)=>{ 
this .getCustomerData(); 
}) 
.catch((error)=>{ 
throw('error',error); 
}); 
} 

реагируют самозагрузки здесь

<BootstrapTable data={this.state.customer_data} search={true} cellEdit={ { 
    mode: "click", 
    blurToSave: true, 
    afterSaveCell: this.onAfterSaveCell 
} } > 
    <TableHeaderColumn dataField="tid" isKey = {true} dataSort={true} width="70">S.No</TableHeaderColumn> 
    <TableHeaderColumn dataField="company_name" dataSort={true}>Company Name</TableHeaderColumn> 
    <TableHeaderColumn dataField="contact_address" dataSort={true}>Contact Address</TableHeaderColumn> 
    <TableHeaderColumn dataField="contact_person" dataSort={true}>Contact Person</TableHeaderColumn> 
    <TableHeaderColumn dataField="contact_number" dataSort = {true}>Contact Number</TableHeaderColumn> 
</BootstrapTable> 

ответ

1

Говоря о v3.0.0-бета-11 (я не использовал его раньше).

Нет проблем.

Но в вашем коде вы не находитесь в правильном объеме.

Так просто это исправить, так что onAfterSaveCell называется на вашем Компонента рамки:

afterSaveCell: this.onAfterSaveCell.bind(this) 
Смежные вопросы