I created modal in grapesjs to edit source code with editor modal. But when I am selecting text and release the button outside the modal, it will close without save.
Check documentation of grapesjs modal. There is link to configuration of modal behavior.
Just disable backdrop into editor init configuration.
const editor = grapesJS.init({
modal: {
backdrop: false
},
// rest of configuration
});
Related
I have a SpeedDialAction (#material-ui/lab#4.0.0-alpha.56) that opens a file dialog. If you choose one or more files it opens a material-ui modal dialog. It's using react-dropzone, but I don't know if that's relevant here. At the beginning of the action click handler I set the open state on the SpeedDial to false, and it closes. When you:
cancel the file dialog
cancel the material-ui dialog
submit from the material-ui dialog
...afterwards the SpeedDial component's onOpen callback is called, and passed 'focus' as the reason. I'm not sure why this is happening or really which component is driving this behavior. Is there an easy way to suppress this?
The answer is in the docs: the disableRestoreFocus prop on Modal, which is inherited by Dialog.
I've created a new plugin that opens an URL in dialogue box (url dialogue box using openUrl) but the problem is this dialogue box is fixed position, not draggable. In previous version 4.8.1
all the dialogue boxes were draggable/movable. I need the same behavior, anyone has any idea how can I make dialogue box draggable?
I just found a new property to make all the modal dialogs draggable. Use the draggable_modal option to enable dragging for modal dialogs.
Code Example:
tinymce.init({
selector: 'textarea', // change this value according to your HTML
draggable_modal: true
});
Reference:
https://www.tiny.cloud/docs/configure/editor-appearance/#draggable_modal
I want a new modal to open up upon the clicking of a link. Can I achieve that using the page builder, and not the code editor in developer mode?
In PageBuilder double click on the button where you want to set your modal popup trigger then click on "Link", there set your target page or external url then set the "open mode" to "Modal"
You can also configure there the size of the modal and if you want to set a Title
I'm developing an app using Angular and Semantic-UI. It should be accessible even for people who use keyboards for navigate the app.
I'm experiencing some problems with modal:
$(".my-modal").modal({
autofocus: true
});
$(function() {
$("#open").click(function(){
$(".my-modal").modal('show');
});
});
Here is the full code of my sample: http://jsfiddle.net/s6o0tdp7
As you can see when you open the modal the focus move on the first button. I would like to have focus on the entire modal, at the begin of the modal container, so users can move with tab button to go to the other sections of the modal that lay below.
Besides the modal should prevent users from going to elements of the page that is under the modal.
How to get these two behaviours?
As the title says, i am working using wicket 6 and it would be very useful if the modal window was to close when i clicked outside of the bounds of the modal window, anyone have any idea on how i might go about this?
Try by adding this JS to your page:
$(function() {
$('.wicket-mask-dark').click(function() {
$('.w_close').click();
});
});