Set focus when inserting a hyperlink in wysihtml5 editor - javascript

We are using wysihtml5 for a project. We noticed that when editing body text, if you highlight some text, and click the 'Insert link' button in the tool bar that focus is NOT set to the text box in the modal that pops up. The result is, if the user highlights text, clicks the insert link button, and pastes in there url with out first setting focus in the modal, then the url is inserted in the body text (behind the modal).
Looking for ideas in either the css or js on where to try and fix this. Thanks!

Upgraded gem from - bootstrap-wysihtml5-rails (0.3.2.100) to bootstrap-wysihtml5-rails (0.3.3.1) and that fixed the issue for us.

Related

ContentTools - Clicking in the link tool's dialog focuses on background element, and not on its input?

I'm using ContentTools in a Bootstrap modal. When I select some text and click the hyperlink tool, the dialog to enter the link pops up, but immediately gives focus to an element in the background (in this case, the modal close button, but when I remove it, it focuses on the first input in the form, etc). This makes it impossible to type in the dialog to create a link.
Any pointers? Not a JS wiz, but from a peek at the ContentTools source, it seems to set up an event handler to grab the click event and give focus to the dialog's input, and I'm assuming that's getting borked somewhere...
Here's a screenshot
For anyone who finds this later, the issue was that Bootstrap's modals maintain focus and re-capture it anytime it is given to an element in the background. Since ContentTools appends itself to the end of the DOM (after my modal), it is in the "background" as far as bootstrap is concerned. Buttons in ContentTools work because they register as click events, but anytime you try to click in an input, it gains focus, and Bootstrap returns focus to the modal.
My solution was to modify the ContentTools source to instead append itself to the end of my modal <div>, and now it's entirely contained within the modal--Bootstrap has no focus issues.

Prevent highlighted text from deselecting when clicking an input field?

I'm making a react application which allows for certain actions to be taken on highlighted text through a pop up.
Confluence
I'm using react-text-selection-popover which works very well. However, the pop up I have has an input field. The trouble I have is that if i were to click the input field (to enter some text), the highlight is deselected and the pop up disappears.
I tried options like user-select: none but it doesn't work.
Example Sandbox
Is there a way to highlight some text and enter some text in the pop-up div? And remove the highlight if i click anywhere else but the popup.

Is there a way to customize the alert box generated by onbeforeunload?

I have a page with text editor that I want to make sure the user knows that the edits they make will be lost before they actually leave. I have done event.preventDefault() for all links in my page and add my own version of alert box (or to be precise, div that looks like alert box), but for leaving by pressing last page, clicking on a bookmark or typing URL directly, I can only use the ugly default alert box.
Is there a way to customize the alert box on leaving?

Sitecore 7.2 error when copying Content Editor ribbon to Page Editor ribbon

In my Sitecore solution I have a custom button with a drop down menu in the Content Editor ribbon. One menu item opens a dialog box, while the other just runs a command. I have not created this custom functionality.
Content Editor ribbon Menu
Set Reminder dialog box
I am trying to move this menu to the Page Editor ribbon. I have tried to both copy all the files from Sitecore/content/Applications/Content Editor/Ribbons/Chunks/Reminder folder to Sitecore/content/Applications/WebEdit/Ribbons/WebEdit/Page Editor, and to create new ribbon items but make them look like the old ones. I manage to get the button visible in Page Editor view, but it looks weird (see images) and when I click on of the menu items I get the following javascript error message.
TypeError: scForm.getParentForm(...).invoke is not a function
scForm.getParentForm().invoke("item:reminderclear(id={267B8748-C6DA-4E8B-B49E-F301974421B7})")
Why does this error appear in the Page Editor and how can I fix it? What does it mean? I understand that the issue is that scForm is null, but why is it not initiated and how can I trigger that?

Why is the focus event not firing inside the CKEditor?

I'm using CKEditor 3.6.5.
In my application there are two text boxes, Ckeditor and then two text boxes respectively. If I using tab stop to navigate the control. when it moves to CKEditor it focusing whole Ckeditor area, but I want it to focus inside the Ckeditor.
How to solve this problem?

Categories