Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not working with JQuery dialog #4626

Open
6 tasks done
DerbyshireSoftware2 opened this issue Mar 20, 2024 · 1 comment
Open
6 tasks done

Not working with JQuery dialog #4626

DerbyshireSoftware2 opened this issue Mar 20, 2024 · 1 comment

Comments

@DerbyshireSoftware2
Copy link

Checklist

  • I've looked at the documentation to make sure the behavior isn't documented and expected.
  • I'm sure this is an issue with Summernote, not with my app or other dependencies (Angular, Cordova, React, etc.).
  • I've searched through the current issues to make sure this hasn't been reported yet.
  • My issue is pertinent to this repository of Summernote (jQuery), or I was unable to have my issue resolved from the relevant version I'm using, such as Angular, dJango, Rails or React. Please try your issue at the relevent repository first.
  • I understand that issues without interaction for more than 14 days (2 weeks), may be closed at our discretion. We do this, as sometimes issues are abandoned. We may at our discretion, add issues to the relevant project to be looked at, or for maintainers to work through as time permits. This is to help keep issues relevant to the current version of Summernote, and to reduce clutter.
  • I agree to follow the Code of Conduct that this project adheres to.

Steps to reproduce

<title>without bootstrap</title> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script src="/summernote/summernote-lite.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> <style> .summernote-textarea { width: 400px; height: 300px; } </style>
<textarea id="summernote" class="summernote-textarea">Some Text</textarea>
<script>
    $(document).ready(function() {
        if (typeof $.fn.dialog !== 'undefined') {
            $(".summernote-container").dialog({
                modal: true,
                zIndex: 1,
                minWidth: 600,
                minHeight: 600,
                buttons: {}
            });

            // Initialize Summernote after the dialog is opened
            $('#summernote').summernote();
        } else {
            console.error('jQuery UI dialog is not available.');
        }
    });
</script>

Expected behavior

That popup windows help and link should work and interact.

Current behavior

In a the above code when you click on a button, the screen is greyed out and you cant interact with the window. For example the help window and the link window are disabled.

Minimal example reproducing the issue

No response

Environment

  • Summernote version:most recent
  • Browser (with version):crome or firefox
  • OS/Platform (with version):windows
@DennisSuitters
Copy link
Member

I've been using Summernote inside an Ajax-loaded dialog with Bootstrap in the past, and more recently with ditching Bootstrap myself, within an Ajax-loaded content within Fancybox. The difference is though, with what I'm doing is, having the script to initialise Summernote within the ajax loaded content.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants