Up until now we have had a basic homemade text editor for the admin web interfaces that we provide. I thought it was about time to change that.
I decided to try out Ext.js and at the same time see if there were a good text editor provided with Ext. Well I couldn't really find that but instead I bumped into which is a very powerful and easy to use WYSIWYG editor. It is easy to customize, it works in the different browsers I have tried and it was also easy to set up with AJAX. I.e. it works very well with the implementation and also with from what I understand. There are many defined functions for all possible scenarios. I can really recommend it.
One thing you must be aware of is that although the editor is applied on textareas you can not use the usual ways of getting or setting that content (i.e. getElementById('textAreaId').innerHTML). Instead you will need to get a handle on the textarea and use TinyMCE's own functions. For example like below:
<script type="text/javascript" src="js/ext-core-debug.js"></script> <script type="text/javascript" src="js/build/util/JSON-min.js"></script>
function getContents() {
// Get a handle on the the textarea var body = tinyMCE.get('body');
// The AJAX request using Ext Ext.Ajax.request({ url: 'content_controller.php', method: 'GET', params: { action: "getContents", pid: document.getElementById('page').value }, success: function(response, opts) { // Decode a json response and place into variable 'obj' var obj = Ext.decode(response.responseText); // Set field values document.getElementById('header').value = obj.header; document.getElementById('subHeader').value = obj.subHeader; document.getElementById('image').value = obj.image; // Set textarea content body.setContent(obj.body); }, failure: function(response, opts) { console.log('server-side failure with status code ' + response.status); } }); }
function getBody() { //Alert the textarea content (for some reason) alert(tinyMCE.get('body').getContent()); }
|
So just go there and download and take a look at a few examples and you will be up and running in no time. The is a good place to look for functionality.