Inserting content into TinyMCE using Ipad's built-in browser - javascript

I'm currently using the following simple code to insert content into TinyMCE's editor:
tinyMCE.get("ole_mce").execCommand("mceInsertContent",false,'hello world!');
It works in every major browser I've tested with, except the iPad's built-in one -which is kinda critical for demonstration purposes.
Anyone knows a workaround for this?
Many thanks!
Edit: iPad firmware 4.2.1, tinymce 3.4.2, jquery 1.5.2

You can't use tinyMCE on the iPad at all, since contenteditable isn't supported there.

Related

Maintain undo functionality with createRange()

I'm working on a Markdown text editor using a contenteditable and Rangy to easily add links and images. The problem is that rangy.createRange();, an important function in the Rangy library, cancels the ability to undo an action (text added in the contenteditable in my case).
I have browsed the Web to find a solution and I have found UndoManager, but I cannot find information about how to use it and if it has been added in Chrome (I'm working on a Chrome Packaged App so I don't care if Safari does not support it).
If somebody knows something about this piece of HTML5 it would be amazing.
Thanks in advance.
According to this link , none of the current browsers support the UndoManager spec. You can test that in your browser by trying to access document.undoManager which undefined in Chrome

HTML Rich Text Editor problems with justify* commands

I'm writing a simple Rich Text Editor which is currently working perfectly in Chrome and Firefox.
Internet Explorer however, is another story. I have finally managed to get most things working in IE with work-arounds and such, but all of my justify commands do nothing.
That is, this bit of code has no effect.
iframe.contentWindow.document.execCommand('justifyRight', false, null);
This is despite all other commands (ie: bold, italic, etc) working just fine.
Any clues as to why the justify* commands are different and not working?
I have a live demo available at http://www.hazaarmvc.com/site/test
Turns out that it was simply the content inside the editor window (an iFrame) that was the problem. It was originally generated using a Mozilla editor. Due to the differences in how each browser renders it's HTML content, IE just didn't know how to apply it's version of justifyleft, etc. Working on an empty editor everything just worked as expected.
See "Internet Explorer Differences" here: https://developer.mozilla.org/en/docs/Rich-Text_Editing_in_Mozilla for an explanation of what is different.
I'm going to chalk this one up to IE just being crap.

FF - Iframe in contentEditable are not loading javascript

I'm currently trying to put together a rich text editor that includes widgets from a different location then the site the rich text editor is on. I'm doing this by providing an Iframe in the content area that is placed at the cursor.
Now the idea behind this instead of providing some kind of placeholder until they finish editing is so they can see what they are talking about while they type.
Now the iframe works perfectly fine in Chrome loads the content as expected, but in Firefox it seems to have disabled javascript in this case (notice none of the script files being downloaded), which is an issue as the widgets are extremely javascript heavy and don't function without it.
I have provided below a JSFiddle showcasing this issue, the site im loading in the iframe is just a javascript game but you will see it doesn't work in firefox but its okay in chrome!
http://jsfiddle.net/reefbarman/2uYja/2/
Any help is appreciated
Scripts won't be executed when designMode is activated (source). Internet explorer was the first browser to add this feature, and Mozilla implemented a similar function, heavily inspired by Microsoft.
Your code functions in Chrome, because Chrome has implemented designMode in a different way.
Well after some research and experimentation I was dealing with two different issues that looked like one.
Firstly I made a change to the rich text editor I was using to use contentEditable only as this seems to be the standard going forward and its a heavily html5 app im working on. So with designMode = 'Off'; the iframe would load in normal situations. But I had a strange issue where adding the iframe to soon after adding another element to the editable area caused the iframe not to load, so just delaying the add of the iframe by some time allowed that dynamically added iframe to load!
Problem solved!

jQuery CSS Positioning onhover of div-elements (Cross Browser Issue)

I am trying to create an interface using jQuery but having some difficulty making it work on different browsers although, what I am linking now should work on most of the Windows browsers.
See here: http://122.173.254.198/picasa_hover_experiment.htm
(Please note the problem part is programmed minimal and solution expected on same)
The problem is with images 3 and 8 which I want to focus on mouseover and show in between as other images. It fails to work on either Opera or IE 6 as I am testing. Would somebody provide me a cross-browser and working solution to it?
Try updating your jQuery to 1.4.2...
http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js

What is the most stable modal dialog implementation across browsers to use from javascript for a web app?

I'm using a lot of JQuery in a web application that I am building for a client and I want to find an javascript implementation of a modal dialog that is reasonably stable across the following browser set.
IE 7+
FF 2+
Chrome and Safari
I've tried a couple of jQuery plugins but there always seems to be artifacts in one of these browsers.
--- Edit
jqModal seems to be more stable but I have an issue in IE7 where the dialog immediately disappears after popping up. I suspect a js event isn't being canceled or something. I'll have a bit more of a play.
I used jqModal few times and I'm very satisfied. It is pretty configurable yet very light weight.
Have you tried YUI? I'm not sure what the support is for Chrome but I've had good luck with it for IE and Firefox and allegedly it works with Safari.
We currently use BlockUI. It's awesome, in word. Can be styled via css (of course), blocks any element and seems stable, certainly in block IE and Firefox....
If you need a hand with it, post and I'll lend a hand...
http://www.malsup.com/jquery/block/
I went through a similar exercise, tried most of the plugins I could find. I used YUI for quite a while with good results; the only issue I ran into was resizing centered modals, which is quite an obscure use case.
I ended up with http://dev.iceburg.net/jquery/jqModal/ , I'm pretty happy with it.

Categories