Here is sandbox Antd pop over
As you can see in the example when you click out side anywhere, popover automatically closed. I want to disable that thing and close it only through click on a button.
I don't see such options in Popover and Tooltip apis.
Is this possible?
For this you need to remove your onVisibleChange={this.handleVisibleChange} method. You can call this.handleVisibleChange function on button click as given below:
<Popover
content={<a onClick={this.hide}>Close</a>}
title="Title"
trigger="click"
visible={this.state.visible}
>
<Button onClick={this.handleVisibleChange} type="primary">Click me</Button>
</Popover>
I have created a working example on codesandbox.io.
Related
I am using a vuetify navigation drawer. Inside is a submenu. When I expand/collapse the submenu it causes the navigation panel to disappear. I am looking for the correct way to prevent that from happening.
I have an example here:
https://codepen.io/uglyhobbitfeet/pen/MWeBLwJ?editors=1010
Note - I purposely set the navigation panel to be temporary instead of permanent, because I don't want the menu displaying unless someone clicks on the hamburger icon.
<v-navigation-drawer v-model="drawer" absolute right temporary>
Your navigation drawer disappear because your watch the property "group". So when group is toggled, the watcher see a change, and it update to false your navigation drawer, as you code it
As your submenu is a nested component, you don't need to add the v-model group just remove it and the watcher
Upon the click of a button, the RadWindow in question opens. Immediately after it finishes doing so, I'd like to click one of the buttons within it. Additionally, I'd like for the window to be hidden upon launch. Is there a simple way to do either of these? Any assistance would be appreciated.
In the Javascript the RadWindow is populated from, I used this.
window.addEventListener('DOMContentLoaded', function() {
console.log('DOM fully loaded and parsed');
$telerik.$("#Submit1").click();
});
In this Kendo UI menu sample, if you click on "Stores" you will see a template-based menu. It has a button "See full list" but it doesn't do anything.
Question: how to trigger an action when an element is clicked in a template-based menu? Note that the menu should close after the action is triggered.
You can close the menu on Button cilck as below:
<button onClick="alert('See Full Clicked.'); $('#menu').data('kendoMenu').close();" class="k-button">See full list</button>
See the updated Menu example:
Updated Kendo Menu sample
I'm using the bootstrap 3 navbar with drop down. Default is behaviour is on click open dropdown and on second click close. I want to visit the link on second click. Is that posible whith default bootstap functionality>
Try this:
$('.dropdown').on('show.bs.dropdown', function () {
$(this).siblings('.open').removeClass('open').find('a.dropdown-toggle').attr('data-toggle', 'dropdown');
$(this).find('a.dropdown-toggle').removeAttr('data-toggle');
});
This will toggle the dropdown open on the first click, while closing any other open dropdowns. If you click the parent of the open dropdown menu again it will navigate to it's href. If you toggle a different dropdown it will "reset" any dropdowns that were open so that you can re-toggle them again.
I have my menu set to:
.CloseOnClick(true)
.OpenOnClick(true)
(I am using MVC4 with Razor syntax)
When I click on a menu item, it opens the menu content, but when I click on the menu item again, the screen jumps down the page when it's not supposed to. I can't figure out why the screen is jumping.
Here is the code in question that is triggered:
items.Add().Text("Stores")
.Content(#<text>
<h2>Around the Globe</h2>
</text>);
It seems the screen is jumping because of the .Content() parameter.
Also, before the menu is clicked, the URL is:
http://localhost:55656/HelloWorld
But after it is pressed the URL changes to:
http://localhost:55656/HelloWorld#Menu-2
Although nothing changes besides the Kendo UI Menu opening up, it's not until it's pressed again that the screen jumps.
Seems like the Menu is navigating on click. This should only happen if you intend the item to navigate () or if you have a JavaScript error on the page and the click on the item is not prevented. Can you check if there really is an error and post it here?