Reloading a jstree without refreshing the page - jstree

I'm trying to reload a jstree without reloading or refreshing the page, the reload should happen onclick of a button, so when the button is clicked im calling
$("#tree-container").jstree('destroy');
//then calling the function that reads or renders the tree
that works fine when no tree is already rendered, however when a tree is already rendered and I click on the button I get this : "cannot call method init of undefined." the error occurs in the jstree plugin.
I even tried removing the container then re-appending it to it's parent container before calling the function that reads the tree
$("#tree-container").remove();
$('#parent-tree-container').append($('<div id="tree-container"></div>'));
//then called the function that reads/renders the tree
but that still didn't work. :(
Thanks in advance.

This will make an ajax call to refresh the tree, but not the page it's contained in:
$.jstree._reference($("#tree-container")).refresh(-1);
That is the best method, but if you prefer, you can just rebuild the jstree over the initial div without destroying it first:
$("#tree-container").jstree({ etc

Are you using jQuery 1.6.2? If so, try a lower version - 1.6.1 should work. - see here

Related

Initializing component inside a home page in Ionic4

I have a Home Page, inside that I have created one component RecentlyViewedProductComponent.
My problem is:
when I navigate to /home by using
this.router.navigate(['/home']);
the ngOnInit() inside RecentlyViewedProductComponent is not working. When I close the app and open it again, that only it is working .
How to solve this problem?
It sounds like you are not using the right lifecycle event.
Have you looked at the documentation here:
https://ionicframework.com/docs/angular/lifecycle
It says that ngOnInit() is:
Fired once during component initialization. This event can be used to initialize local members and make calls into services that only need to be done once.
If you want it to be called every time you navigate to the home page then you want to replace this with something like ionViewWillEnter():
Fired when the component routing to is about to animate into view.
There is actually some guidance at the end of the docs page that you might find interesting which explains when to use each life cycle method.

TinyMCE inside Durandal widget - callback after routing transition?

I'm trying to use TinyMCE in a widget but it fails. I think the problem is that view is still hidden when "viewAttached" is fired. It seems that TinyMCE has a bug/feature (read last paragraph) and can't be displayed when the target (textarea) is hidden (or inside a hidden div).
I got it working by doing the job in a setTimeout but it's crappy.
Is there a callback that I could attached to which is fired after the view is unhided (after the transition is completed)?
I found one solution:
Explicitly subscribe to the "isNavigating" observable of the router and add TinyMCE when "isNavigating" value becomes false.
Still : this has the effect of flickering - you see the textarea and then it is replaced by TinyMCE... but this is not a Durandal problem IMO.
Edit 1
Finally, I think the the best solution (for now... follow the link below for the thread on the subject) is to do a setTimeout(xyz(), 0) - I have seen a lot of people using this technique and it prevents the flickering.
https://groups.google.com/forum/?fromgroups#!topic/durandaljs/5NpSwMBnrew
Durandal does have a callbacks when you're using composition - you just put a function on to your viewModel with the correct name. In your case, you would use viewAttached:
Here's the docs:
http://durandaljs.com/documentation/Interacting-with-the-DOM/

How to render element in gwt?

From last few months I am working on gwt-ext.In that I am using a doLayout() method of Container class.Here is description of it.
Force this container's layout to be recalculated. A call to this function is required after adding a new component to an already rendered container. If you are not dynamically adding and removing components after render, this function will generally not need to be called.
Do this method is basically used to render container.
Now I am using core gwt 2.3. Is there any method to render the container in gwt.or any other way to achieve this ???
Thanks in advance
AFAIK, GWT does not require this. Just call .add() on any Panel to add children. They should be immediately visible.

Disposing components in an Eclipse view issue

I have few components in a view and I am disposing them by clicking on a hyperlink as below -
toolkit.dispose();
form.dispose();
imageHyperlink.dispose();
Before disposing I appended a line to add components named Browser as -
browser = new Browser(parent,0)
browser.setUrl("www.....com");
The components are getting disposed properly, but to find the browser, I need to restore the view,means I need to double click on the view tab, then only the browser URL is coming up.
How to resolve this scenario.
I got a work around to solve the above. Since the after dispose, the view was expecting restore to refresh again, so I appended the size of the view every time after each refresh like this -
parent.setSize(getViewSite().getWorkbenchWindow().getShell().getSize());

Unable to call getValues() on an Ext Js FormPanel on initialization of a container Panel

I have an Ext Js panel that I am adding to my main TabPanel. The panel I am adding contains a FormPanel as one of it's items and inside the FormPanel I have a Name field. What I want to do is change the name of the Tab based on the name in the form field.
The problem is that if I call the FormPanel's getForm().getValues() inside of the panel's initComponent, I get the following javascript error:
Uncaught TypeError: Cannot read property 'dom' of undefined
If I do this outside of initComponent (e.g. on a button press) everything works fine. After doing some testing, I think the issue is that the FormPanel isn't actually rendered yet (and thus the dom doesn't exist), getValues() fails. However, I can't seem to figure out a way to get my FormPanel's values from the Panel on load.
I tried to listen for events. I tried:
this.detailForm.on('afterrender', function () { alert('test'); });
but doing this showed that AfterRender is called prior to the form actually being rendered (it's not visible on the screen). Changing the alert to my custom function handler produces the previous dom exception. I attempted to use the activate and enable events instead of afterrender, but even though the API says that FormPanel fires those events, the alert('test') never gets called.
I can't seem to find any way for my panel to get the inner FormPanel's values upon loading my panel. Does anyone have any ideas?
Using getFieldValues() in place of getValues() will collect values by calling each field instance's getValue() method instead of by reading from the DOM. This should allow you to get your values regardless of the form's rendered state.
I've got the same problems on one of my projects, I managed to fix it using the afterlayout event.
I'd give setting .deferredRender:false a try.
Ext.TabPanel.deferredRender
Probably best to roll out of your afterlayout changes, then test with just a straight deferredRender:false config item.
I believe the problem is caused because the inactive tabs are not rendered until they become active. In your scenario, you cannot get the values, because they don't exist until the tab is activated/shown.
Setting deferredRender:false will render the items within all tabs. There could be a performance hit by setting deferredRender:false, so testing you must do.
Hope this helps.