Hi,
I am unable to change/update the value of rowHt.
//--- CODE ---//
componentDidMount() {
this.rowHeightManager();
}
changeDropDown(e) {
const rowHt = parseInt(e.target.value, 10);
jQ(`#${this.props.id}`).pqGrid('option', 'rowHt', rowHt);
jQ(`#${this.props.id}`).pqGrid('refreshDataAndView');
// This is updating the value but not reflecting on Grid UI
console.log(jQ(`#${this.props.id}`).pqGrid('option', 'rowHt'), rowHt);
}
rowHeightManager() {
const $option = [25,50,75].map(item => `<option value="${item}">${item}</option>`).join('');
const $selectBox = `<select id="changeRowHeight" class="ui-corner-all">${$option}</select>`;
const $footer = jQ(`#${this.props.id}`).find('.pq-grid-footer.pq-pager');
$footer.append(`<span class="pq-separator"></span><span class="pq-page-rppoptions">${$selectBox}</span>`);
$footer.find('#changeRowHeight').on('change', this.changeDropDown.bind(this));
// console.log($footer);
}
//--- END CODE---//
The above code will add a dropDown in footer next to pagination section. On changing the value from the dropDown, the row height should changed. Is this the correct implementation or could be other way.