How to dynamically open a collapsed grid? - javascript

I have a grid that is initialized in the 'collapsed' state when it is first loaded. I want to have the grid open when an element outside of the grid is clicked. I tried to find a built in jqGrid method that would allow me to do this but with no luck.
My best attempt is to trigger a click event on the open/close button.
$('#gridwrapper').find('.HeaderButton').click()
Is there a more elegant solution?

I've solved the issue using this:
$('.ui-jqgrid-titlebar-close').click();
I've used jqGrid 4.6.0.
DEMO

Related

How can i add bootstrap popover to w2grid custom button?

How can I implement a bootstrap popover on the custom button in the w2ui grid?
You dont have any code samples or extracts. So the simple answer would be to add the data-attributes dynamically with js then create an instance with the Bootstrap popover JS.
[https://getbootstrap.com/docs/5.0/components/popovers/#getorcreateinstance][1]
Again your question doesnt state wether the button is in a row or outside the grid, does it have a unique identifier?
Please elaborate more in order to get help. Also state what you have tried and what not.

Using KendoReact DropDownList into ReactBootstrap Modal

when I use a KendoReact DropDownList into a ReactBootstrap Modal the expanded list appears UNDER the modal so it can't be interacted with.
I read several issues that was pointing to a focus loss, which is not exactly my case, due to the fact that Kendo PopUp was append to body instead of the Modal itself, and the 'appendTo' prop seems to be a good solution for me but it exists only for the Kendo PopUp component, not for the Kendo DropDownList one (which uses PopUp underlying)...
I've made a repo illustrating this issue : https://github.com/lePioo/react_kendo_dropdown_into_bootstrap_modal
And a LIVE demo for this repo (take some time to load):https://react-kendo-dropdown-into-boot.herokuapp.com/
Set bigger z-index for the animation container of the popup using CSS. And it will be on top of the modal to resolve it.
.k-animation-container{
z-index: 10000
}
Leave it to be rendered into the document. Since if you render it using appendTo to the Modal, the DropdDown will not be entirely visible when opened, or scrollbar will appear in your dialog. This is the purpose it is rendered into the document.
#Xizario's answer didn't work with V4.14.x
The solution that finally worked was to use ZIndexContext.Provider from '#progress/kendo-react-common':
<ZIndexContext.Provider value={10003}>
<DropDownList {...yourProps} />
</ZIndexContext.Provider

How to prevent showing ion-option-button in IonicFramework?

I use different list in one page with each list have some Option button,
you can take a look at my codepen : [http://codepen.io/harked/pen/WvMgXg][1]
If we swipe the first card, it will show the option button.
If we swipe the second card, it will also show the option button.
Is there any way to prevent Option-Button to show while the other in another card is showing?
I mean the problem is like this pict : http://www.nanonimos.com/IonOption.jpg
Anyone? It would be greatly appreciated.
It doesn't look like Ionic have a way to do this right now. What we need is a listener on the option buttons being display, at which point you can close all others, but that listener doesn't exist.
You could build custom functionality and listen for swipe events on each ion-list item, but this is likely to be a little buggy. Alternatively dig into the framework and try and emit a custom event on the same trigger than Ionic uses.
You probably have an ng-repeat when working with lists in Ionic. You can easily disable Option buttons using ng-show as in this codepen.
[http://codepen.io/anon/pen/vORyaz?editors=101']

Override default navigation buttons functionality in jqGrid

Question is simple: Is there a way to override the behaviour of the default buttons placed in the navigation bar of a jqGrid grid?
I'm using the struts2 plugin and I needed to launch an action if user clicks the add button or the edit button to redirect to another page in which this things are done. I wondered if it was possible to override it's default behaviour as I think it's cleaner than defining myself new "add" and "edit" buttons.
Documentation for adding such new buttons HERE.
You create first navigator bar using navigator="true", but with navigatorAdd="false", navigatorEdit="false", navigatorDelete="false" and so on (see the documentation). In the way you will have navigator bar without any buttons. Then you add custom buttons with the same icons like standard editing buttons (see the example which you referenced). You need uses icon: 'ui-icon-pencil' for Edit, ui-icon-plus for Add, and ui-icon-trash for delete. Inside of onclick callback you can place any your custom JavaScript code.
UPDATED: The names and the values of navigatorExtraButtons are build based on the options of navButtonAdd method. I've found additionally this code which should help you.

How to programmatically expand fuelux treeview folders using jQuery?

I've been stuck in this problem. I am using fuelux treeview to display a list of categories and folders. What I want is to display the expanded treeview on page load. I can't seem to achieve this. I have found out that the tree folder must be clicked before the folder items are populated. So i tried to use
$('.tree-folder').trigger('click');
to trigger a click so that it may expand automatically. But this doesn't seem to work. I've tried
$('.tree-folder').click();
but it wont work too.
So how do you automatically trigger a click or just how do you automatically expand the fuelux treeview? Any ideas? Thanks in advance.
You'll want to makes sure you are triggering the click event on the correct element.
https://github.com/ExactTarget/fuelux/blob/3.2.1/js/tree.js#L35-L42
For Fuel UX 3.2.1 (current as of answer) run the following in the console on http://getfuelux.com/javascript.html#tree-usage for an example.
$('#treeIllustration .tree-branch-name').trigger('click')
This triggers the openFolder method which you could call directly.
https://github.com/ExactTarget/fuelux/blob/3.2.1/js/tree.js#L198
At this point after loaded.fu.tree triggers a method could be created/called to climb the tree recursively and call openFolder
This would be a nice enhancement. Please submit an issue so that it can be prioritized. If you come up with a good solution feel free to submit a pull request.
https://github.com/ExactTarget/fuelux/issues/new

Categories