I am using https://github.com/chromawoods/instaFilta for filter a table
The table has dynamic row insertion using ajax and each row cells can be updated using edit in place using:
https://github.com/itinken/jinplace
Now when i add a new row and then edit for example "title" to "Linux" and then try to filter, it will show the row which has "Linux" and if i again change "Linux" to "Unix" and again try filter without reloading the page from server - the word "Unix" will be changed to old data - here, "Linux" and the filter will not work and when i reload the page, the title is showed correctly "Unix".
So the dom gets updated from stale data when i try filtering.
Code:
//In place edit
$(document).on('click', 'span.editable', function(event) {
$('.editable').jinplace({
url: '/onit/web/data-updater.php',
textOnly: false,
placeholder: '',
okButton: '',
cancelButton: ''
})
.on('jinplace:done', function(event, data) {
console.log('Successful! New value is', data);
});
});
and this is the code for
// Filter
$(document).on('click', '#filter-me', function(event) {
//event.preventDefault();
$('#filter-me').instaFilta({
//scope: '.content-wrapper',
//targets: '.instafilta-target',
caseSensitive: false,
markMatches: true,
beginsWith: false,
matchCssClass: 'instafilta-match',
itemsHideEffect: 'slideUp',
itemsHideDuration:300
});
});
How can i make the filter update when a row is updated using edit-in-place or how can i tell instaFilta to get the latest dom?