I have requirement enable/disable the columns in the tabulator. Column is disabled using toggle method and and i am enabling back using show method.
table.getColumns().forEach(col => {
if(true){
{
col.toggle();
}else{
col.show();
}
});
I configured persistence mode as below
persistence: {
sort: true, //persist column sorting
filter: true, //persist filter sorting
columns: true, //persist columns
}
persistenceMode: "local",
persistentLayout:true,
Now problem is every time when i hide the column it works temporarily but when i reload or relogin everything comes. Expectation here is removed column should not appear. Rearranging the column order is retained after reload but not toggled one. Can some one advise how to persist the toggled column or is there any way to achieve this?
Related
I have a multiselect header filter in my Tabulator table initialized as so:
{
title: "Building",
field: "Building",
headerFilter: true,
editor: "select",
headerFilterParams: {
values: buildings,
multiselect:true, //allow multiple entries to be selected
}
}
After the table initialization, I tried to set the filters for the building column as such
table.setFilter("Building", "in", userBuildings);
table.refreshFilter();
The filters are successfully submitted back to the server for filtering, but are not displayed in the table header. I can't find any reference to set the defaultValue field to an array and was wondering if anyone knows of a way to achieve that.
Thanks in advance!
I able to move columns as expect and resize them as expected, but on a data reload of the grid or when returning to the page, the Grid reset back to the original layout.
var table = new Tabulator("#gvRecords", {
ajaxURL: document.getElementById('urlAPI').value + "/Properties/Get/",
selectable: false,
ajaxParams: { "PropertyID": PropertyID, "Tab": Tab },
movableColumns: true,
persistenceMode: "cookie",
persistenceID: "Properties",
persistentLayout: true,
Any help is appreciated, not sure why I doing wrong, I was able to have this work a while back when testing out Tabulator, but now that I trying to implement, I can't see to get it going.
I have implemented instantsearch.js with 1 search input and multiple indices, and multiple stats/pagination widgets. Everything seems to be working correctly except for the pagination widgets.
Here is a codepen https://codepen.io/flrrrhoffpauir/pen/EEpWre
collections.addWidget(
instantsearch.widgets.pagination({
container: '#collections-search-pagination',
showFirstLast: false,
labels: {
next: '>',
previous: '<',
},
cssClasses: {
root: 'search-pagination'
}
})
}
search.addWidget(
instantsearch.widgets.pagination({
container: '#stories-search-pagination',
showFirstLast: false,
labels: {
next: '>',
previous: '<',
},
cssClasses: {
root: 'search-pagination'
}
})
}
If you search for ‘martin’ and then click the Stories tab, you can see the results and that the pagination is working. If you now click the Collections tab, you can see that the pagination widget has the correct number of pages based on how many results were returned according to the stats widget, but then you click to go to page 2, you are just scrolled to the top of the page and it doesn’t load the page 2 data.
How can I get two or more pagination widgets on the page at once that both work correctly?
This is what I went off of to create the multiple index search, but they don't cover multiple pagination widgets: https://jsfiddle.net/j9nwpz34/49/
The searchFunction implementation should transfer all the information that needs to be synchronized. For example, in your case you have a pagination widget that you want to sync across instances of InstantSearch, so you want to transfer the pagination property on top of the query parameter.
var search = instantsearch(
{
/* appId: '',
apiKey: '',
indexName: 'movies',*/
searchFunction: function(helper) {
var query = movies.helper.state.query;
var page = movies.helper.state.page;
products.helper.setQuery(query);
products.helper.setPage(page)
products.helper.search();
helper.search();
},
searchParameters: {
hitsPerPage: 3
}
});
I've modified the JSFiddle to match your need. You can learn more about this state by going to the JS Helper documentation (internal state management of InstantSearch.js).
Update based on the jsFiddle provided:
The rest of the example still holds. However, one thing to note is that if you make a modification in the helper, it will reset the page. In the provided fiddle, you do such a change in the collections searchFunction. You will always set the query, which will always reset the page to 0. Hence the bug.
Here is a fixed fiddle
I am seeing two different behaviors and not sure why. Parts of the question are result of testing solutions implemented from other Q & A.
Summarized Grid create(I only included properties pertinent to question)...
grid setup1
url: jqDataUrl,
datatype: "json",
mtype: "GET",
//loadonce: true
// Default sorting
sortname: typeof prefs.sortCol !== "undefined" ? prefs.sortCol : "LastName",
sortorder: typeof prefs.sortCol !== "undefined" ? prefs.sortOrd : "asc",
sorttype: "text",
sortable: true,
postData: { filters: JSON.stringify({ "groupOp": "AND", "rules": [{ "field": "FirstName", "op": "cn", "data": "max" }]})},
search: true,
results 1 with search: true
When the above grid first loads, it loads with filtered results from postdata filters. If I go to edit url of a resulting row and come back, the record in grid not updated, even though the page/grid above is reloading from scratch from server.
grid setup 2
//same as above but
search: false
results 2 with search: false
When the grid loads this time, the filter not applied. If I go to edit url of a row and come back, the record is updated.
I've read a lot of posts about setting loadonce: true, and changing datatype from local to json and json to local for refreshing, but what I want is for the grid to always load, sort and filter from server data.
Although I understand that free jqGrid does things better, unfortunately, I cannot replace current jqGrid.js file.
My question is two part:
1) I do not see search as an option on wiki here so where is it defined.
2) Can and how do I get the postdata filters to apply on load AND my records updated on the grid after edit?
To answer my own questions:
1) search:true will send _search==true in the http request.
2) The postdata filters(aka where clause when querying data) was being sent in the http request, however, my controller was performing different operations based upon the search: value(aka _search) parsed from http request.
Inside my controller I was setting another property based upon the _search value, and the controller's property was then used to determine whether or not to refresh grid data or use session. It was using session and thus did not update my filtered results after edit.
Another issue I found, was that if I had search:true and manually reset postdata filters to {}, my controller had an error(non thrown w/o try/catch) when it tried to setup the linq with a null, and exited out of grid setup and displayed nothing.
I have a JQGrid with a checkbox column as shown below. Once I enter the required data in JqGrid, I do a form submit. From the http posted file I can read the values entered in each field for textboxes and dropdowns(all of these are required). But for Checkbox user can either check or uncheck. When form is submitted I only get the checked values of checkbox. I am retrieving the values as shown below. How to retrieve the values of unchecked checkboxes as well, when form is submitted
string[] checkValue = context.Request.Form.GetValues("clientView");
{ name: 'clientView', index: 'clientView', width: 100, editable: true, edittype: "checkbox", editoptions: { value: "True:False", defaultValue: false }, align: 'center' },
Fixed it as per the Demo. Added a Hidden field to save the checked and unchecked values of checkbox