I'm creating a dataTable by adding the data to a table in the DOM, and then initialize the dataTable when the data is ready.
I'm using filtering, by adding custom hidden spans with keywords in the table, which works fine. However when I dynamically change the table's DOM with JavaScript to change the added keywords, the filter still uses the keywords that where in the table's DOM at the initialization.
I'm looking for a way to somehow "refresh" the table so that the filters will use the new keywords that has replaced the old in the DOM. Any ideas?
Related
I'm new to VUE but not to programming. The project is to convert an older server-built website to VUE and I'm looking to find the most efficient method to save data.
When a form (page) is loaded I pull the data from our server in a JSON object which is nicely converted to a JS object. Its big -- hundred or so properties.
I'm currently storing the object in a PINIA store as a reactive object, applying the object values directly to form inputs using v-model and everything works, is reactive, and once completed my object has all the necessary information to update (patch) the document.
What I'd like to do is send to the server JUSt the object that was changed and its new value.
For example: assume the object has many fields -- I'll just provide a few here
event:{user:'scott',pass:'12345',startDate:'11/01/2023',endDate:'11/01/2024'.....}
The page has tabs and in each tab we pull a subset of the complete object (fetched and stored).
Therefore, store.event object has one change -- startDate --
I'd like to build a function that watches the entire (100+ object), fire if any field has changed, then save it somewhere without an individual watch or computed property for each 100+ objects.
Suggestions?
I tried using watch with multiple elements -- it did fire but I was unable to determine which element (object) changed.
Watch(() => [store.event.contractdate,store.event.contractduedate],(cv,ov){.. do something}
Is what I am trying to do in this gist possible?
https://gist.run/?id=bea803b05ad8d5b5e3e0afd59bb8dbb1
In app.html, I'm trying to use a repeat.for to create a custom element called button-row
In app.js, I'm creating two button row instances which I then place into a button row array so that I can use the repeat.for to iterate over it and create the button rows on the app.html view.
In button-row.html, I have a repeat.for to create the buttons using the btns array and setting the name of the button.
In button-row.js, I have two properties. label is the label for the button row and btns is the array of all the button names I want to create.
Sorry if this is a noob question, I have only been working with web development and aurelia for about a month.
Instantiating the ButtonRow objects yourself won't work. Aurelia instantiates the instances. you'll need to use the binding system to pass in the information to the custom element. I updated your gist here: https://gist.run/?id=6ec71143f566571960b7a182d4d98ed4
Also, you should refrain from abbreviating words like "Button" let your tooling save you the keystrokes, while making your code more readable :-)
Does anyone know the Yet Another DataTables Column Filter (yadcf) js plugin ?
It doesn't have much documentation and I can't figure out how to set the default number of rows to display (it shows 10 rows as default and I want at least 50).
Quick answer: "pageLength": 50 (for 1.10+) or "iDisplayLength": 50 (for 1.9-)
Long one:
You need to distinguish between the datatables plugin and yadcf plugin
The sole purpose of yadcf it to allow the user the ability to easily add various types of filters to the datatables table
This jQuery plug-in allows the user to easily add filter components to table columns, the plug-in works on top of the DataTables jQuery plug-in.
So your current question is not related to the yadcf plugin,
But if you look at the yadcf showcase you can spot that in on of its pages it demonstrate the use of the iDisplayLength attribute (which is the one you need your case)
Look at the page Yet Another DataTables Column Filter - DOM source example, scroll till you see the code snippet used on that page , notice the: "iDisplayLength": 25
p.s I'm the author of yadcf
I have an EnhancedGrid which is bound to a dynamic Store. I am using lazy loading, so as I scroll down, more data will be fetched and bound.
I also have an "add new Item" functionality. This will open a pop-up where the user creates the new Item in a form, and on Save the item is added to the store. with dojo.data.ObjectStore.newItem() and dojo.data.ObjectStore.save().
My problem, after using those two functions, the item is automatically appended to the grid at the bottom, which is kinda of a nuisance. The user will have to scroll down to find it, which would trigger the lazy loading.
After following the code around, I found out that newItem() calls the dojox.grid.DataGrid._addItem(item, index, noUpdate) function.
I managed to overwrite it so when I am adding a new item, the _addItem function will be called with index 0. But that does not work since it was just replacing the first row with the new one instead of prepending it.
Is there any other way to look at this? is it possible to actually do it?
I am trying to delete the selected record from the drop-down grid.
In trying to do this, I've so far learned that DSOperationType.FETCH is called when the fetchData() method is called on ValuesManager class. So now I want to know what line should be executed for calling DSOperationType.REMOVE.
Or is there a better way to accomplish this task?
DSOperationType.REMOVE will be called only when removing data/row from list grid or tree grid. It can be triggered functionally by calling ListGrid.removeData(someData) or ListGrid.removeSelectedData();
But for ComboBox/SelectBox (DropDown) type item there is no functionality to remove data from list as it can only be selected from a list of data (while loading data for list FETCH operation will be called).
You can implement the functionlity indirectly by using Combobox/SelectItem with listgrid - (ex:http://www.smartclient.com/smartgwt/showcase/#dropdown_grid_combobox_category). In listgrid you can have remove data functionality. Also check other types of functionality that can be implemented with combobx http://www.smartclient.com/smartgwt/showcase/#multi_select_combobox_category