Changing data in a extjs 4.1 store on demand - javascript

I am using extjs 4.1 data store. I have attached the store to three grids.
When user selects a record on gridOne, I update addedOnGridOne property to true. Similarly when user add a record on GridTwo, I update addedOnGridTwo property to true.
Now I have a added a checkbox, when this checkbox is checked, I need to reset addedOnGridOne & addedOnGridTwo properties available in the store & while this checkbox is checked, i need to separately maintain addedOnGridOne & addedOnGridTwo properties.
What I want is: After the store is loaded for the first time, I want to create two copies of data available in store.
If the checkbox is chedked, I will load the first copy of data and if user is on tab two I will load second copy of data.
What options are available to me here? is it a good idea. Is there any better approach? Please suggest

One store for more grids almost always leads to troubles as sorting, filtering and editing influences all three grids. If you need three grids working with the same data you could have three separate store instances loaded with the same data.

Related

CheckboxList not retaining it's check mark on postback

Checkboxlist control in a repeater control & ASP.net C#. Whenever I check its items it gets uncheck automatically. I am also calling this method when the page is not postback as well but it is not working & gets uncheck although I get the values but clears out the checkmark. I do not want to use the session.
If you are in page load re-binding the repeater then you lose the settings. So you need to only bind on first load
(if IsPostBack = false then databind)
So if you re-bind the check boxes each time, then you lose their settings. The other way is to create a array or better yet a dictionary pair list - when you check a item, ALSO save that setting in the dictionay list based on row index. Then you can re-bind on load or as you like, and in the row data bind event, you set the value of the check box based on the dict pair list you maintain (you have to save that list in viewstate or session).
So, it is MUCH less work to simply ensure that you ONLY fill + bind on first page load. If you at any time re-bind the repeater, then you lose your settings. So they will persist ad survive round trips (post-backs), but ONLY if you bind one time on first page load.
It not all that hard to build up a "list" of you made choices and then on row data bind event check + set the values from that small list of choices. But as noted, it obviously easier to just avoid re-binding. However, in the cases that you can't avoid a re-bind, then you need to write your own code to persist the choices.

angular page data sort itself when click anywhere on page

Mouse Click anywhere on the page, even blank spot, the data array on the page just resort itself.
I know that click might trigger view change if impure pipe is set but I didn't use any.
So I am really baffled because my development testing is OK. Only the production build has this weird behavior.
I use angular 8. The data on the page is array down from rest endpoint. I simply for loop it like all other pages does. This page is just having a big object as the response and containing 3 big arrays. And I make 3 different list on the page. Each list is also a input for a sub component. Display after sorting.
I know JS sort does not copy. But why only on production build?
I fixed it by removing the pipe which is used to filter the lists. That's it.
But I couldn't explain the cause of it.
The pipe is doing a filter. It filters the list based on some ids which belongs to the data.
A checkbox will trigger the filtering which is *ngIf on the tables row in the template.

Ext JS 3.3 Edit multiple rows at once

We have some records populated using EditorGridPanel inside a TabPanel.
Currently records can be modified and saved one by one.
I am looking for best approach to provide an ability to edit multiple records at the same time.
Here is my approach and challenges.
-User selects multiple records
-A button provided to unhide a FormPanel with the fields to be modified. (This can be done in same tab OR a new tab can be opened )
-The user changes the needed elements and clicks Save.
-The changed elements are updated across all selected rows.
Challenges:
-I am using Ext JS 3.3.1 library.
-Not able to figure out how the data can be passed from the new form to records on first tab
-Tried creating one blank record on same grid. Updating it will make updates to all selected records.
Would be great if more thoughts/pointers can be shared.
Sorry I haven't provided more info codewise. However hoping that I have explained the problem.
I can provide more specific info as needed. An image would have been easier to describe however unable to attach

Select all and none on items list , in knockoutjs

I am trying to implement a list of items that each have a checkbox to select the item. On top of the list, there is 2 radio button to check all or none items. However, when I update the selected list, the checkbox is not checked. I have got a fiddle here to illustrate the problem:
http://jsfiddle.net/hawaii/VcZBf/2/
Could you guys help me on this please.
Thanks
UPDATED
So you want to do a "checkAll(On this Page)" implementation.
To maintain changes to your checks from one paging event to the next, I would push the currently checked items in the grid to the server during the paging event, or have the act of checking / unchecking maintain back to the DB right after each event. Its a cheap call, and you aren't at a risk of losing checked items because the user hit the backspace key accidentally.
Without sending the checks to the server on every paging operation...
your checks to be stored locally separate from the list even when the template that those records represent is paged to another page.
(make sure to only update the people observablearray when you get your next page)
then, importantly, on every page event you need to apply the checks back onto the grid for the shown items.
Finally, to aleviate the fact that the checkmarks arent representing their checked state (you click check-all, and you don't see them get checked). This is because you had checked:$parent.checkedPeople. which will never work, since checkedPeople is an array, not a boolean. I changed this to a function that asks if this person ID is in the checked People array
anyhow.. here it is: http://jsfiddle.net/VcZBf/24/
Its a rough concept.
WITH sending the current checks to the server on every paging operation
Each object now would have an "isChecked" observable.
On every paging event, the current page's checkmarks are persisted to the DB server side.
Then if you page back to a page with checkmarks on it, they show back up for you.
Much smoother.
reference from previous answer:
http://en.wikipedia.org/wiki/Principle_of_least_astonishment
I simplified your structure a little bit. I don't think having both people and checkedPeople was really knockout-y. If you do want checkedPeople, it can probably just be a read-only computed observable.
I added an IsChecked field to the initial people (all false). I then changed the checkboxes to map to that. Finally, I had the radio buttons change all IsChecked fields using arrayForEach.
Right now, the radio button GUI isn't really intuitive. You can take two appraoches:
Make them regular buttons (recommended)
Make them check and uncheck automatically by data-binding the checked to a computed allChecked flag in the model. This would mean they check automatically even if you check the boxes one by one.
I also took out your logging. I'm assuming that was debugging, but you can re-add it if needed.

linked comboboxes with one store in Extjs 4.0

I have 2 comboboxes. The first selects a category, the second selects the sub category. Both categories are stored in one store with fields: id, parentId, label. Filtering the store isn't working since both comboboxes are bound to the same store.
How can I link the comboboxes? How can I filter the list of the second combobox?
Instead of referring to the same store use Ext.create() to create a new instance of the same store for the second combo box. Use select or change listeners on comboboxes to trigger filtering from one to the other.
EDIT:
Here is an example of such a beast :) http://extjs.wima.co.uk/example/1
This is not mine but sounds exactly what you are doing. Please note the way the stores are setup for each combo box. The first Combo CREATES a new store with the new operator - although this is not the best practice, it will work. The best practice is just to use Ext.create(..).
The second Combo refers to an existing store. In your case since you are reusing the same store definition you want to use Ext.create(...) on both Combos.
For more reference on best practices of class system read this guide: http://docs.sencha.com/ext-js/4-0/#!/guide/class_system
friend.....try filter on the store.

Categories