![]() |
|
Snippets |
|
A few days ago i found a problem about how to edit some term of a contract explicitly or with the WYSIWYG way. So I tried to googling and found this fancy example about how to cover my problem, that was inPlaceRichEditor. The first step, i tried to create A helper that could render the rich editor easily by modified the JavascriptHelper that is included in sf directory. You should notice that this stuff need Prototype 1.6, scriptaculous 1.8 and tinyMCE 2.1.3. put this code on your apps/lib/helper directory;
<?php /* * AjaxEditInPlaceEditor.php * Helper for in place rich editor */ function input_in_place_rich_editor_tag($name, $url, $editor_options = array()) { $response = sfContext::getInstance()->getResponse(); $response->addJavascript('/js/prototype'); $response->addJavascript('/js/scriptaculous'); $response->addJavascript('/js/controls'); $response->addJavascript('/js/effects'); $response->addJavascript('/js/tiny_mce/tiny_mce'); $response->addJavascript('/js/inplacericheditor'); $response->addJavascript('/js/tiny_mce_init'); $editor_options = _convert_options($editor_options); $default_options = array('tag' => 'span', 'id' => '\''.$name.'_in_place_editor', 'class' => 'in_place_editor_field'); return _in_place_rich_editor($name, $url, array_merge($default_options, $editor_options)); } function _in_place_rich_editor($field_id, $url, $options = array()) { $javascript = "new Ajax.InPlaceRichEditor("; $javascript .= "'$field_id', "; $javascript .= "'" . url_for($url) . "'"; $js_options = array(); if (isset($options['tokens'])) $js_options['tokens'] = _array_or_string_for_javascript($options['tokens']); if (isset($options['cancel_text'])) { $js_options['cancelText'] = "'".$options['cancel_text']."'"; } if (isset($options['save_text'])) { $js_options['okText'] = "'".$options['save_text']."'"; } if (isset($options['external_control'])) { $js_options['externalControl'] = "'".$options['external_control']."'"; } if (isset($options['options'])) { $js_options['ajaxOptions'] = $options['options']; } if (isset($options['with'])) { $js_options['callback'] = "function(form, value) { return ".$options['with']." }"; } if (isset($options['highlightcolor'])) { $js_options['highlightcolor'] = "'".$options['highlightcolor']."'"; } if (isset($options['highlightendcolor'])) { $js_options['highlightendcolor'] = "'".$options['highlightendcolor']."'"; } if (isset($options['loadTextURL'])) { $js_options['loadTextURL'] = "'".$options['loadTextURL']."'"; } $javascript .= ', '._options_for_javascript($js_options); $javascript .= ');'; return javascript_tag($javascript); }
As my experience,the inPlaceRichEditor need prototype.js,scriptaculous.js, inplacericheditor.js, controls.js and effects.js exists in the same directory (in /web/js directory). I don't know if you may be could cover this problem if u stay using alias or using sf_prototype_web_dir(/sf/prototype).
and then, here we go.. put this code on your template to perform the ajax in place rich editor
<?php use_helper('AjaxInPlaceRichEditor') ?> <div id="term1"> your text ready to edit </div> <?php echo input_in_place_rich_editor_tag('term1', 'myModule/myAction',array('options' =>"{method: 'post'}")) ?>
that's it, very simple and very nice stuff.
PS:i'm sorry if my english sounds pretty awkward, cause i don't speak english well