ckeditor : how to make read only, how to remove the toolbar in a dynamic way

[Serge Bourgeois]

I just implemented the ckeditor plugin. It looks great, but I need help (example if possible) showing how to hide the ckeditor toolbar for some text fields, for instance in a controller with a smartgrid, where request.args does not contain 'now' nor 'edit'.
Thanks in advance !
Serge

[Serge Bourgeois]

in stead of 'now' and 'edit', read 'new' or 'edit' ...

--
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
---
You received this message because you are subscribed to a topic in the Google Groups "web2py-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/web2py/tnDhxZZLfdI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to web2py+un...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Tim Nyborg]

Depends on how you're implementing the widget.

I've got a CKEditor widget as follows (pretty much a glorified copy of text.widget with the ckeditor class):

class CKEditor(FormWidget):

    _class = 'ckeditor' 

   

    @classmethod

    def widget(cls, field, value, **attributes):

        """ 

        generates a TEXTAREA tag. 

        

        see also: :meth:`FormWidget.widget`

        """ 

        default = dict(value=value) 

        attr = cls._attributes(field, default, **attributes) 

        return TEXTAREA(**attr) 

Used in the model, it's:

idb.define_table(

    'module',

    Field('id', 'id', readable=False),

    ...

    Field('description', 'text', widget=CKEditor.widget)
    )  

So to do what you're suggesting, I change it to:

def hideable_ckeditor_widget():
    return SQLFORM.widgets.text.widget if 'new' in request.args or 'edit' in request.args else CKEditor.widget

idb.define_table(

    'module',

    Field('id', 'id', readable=False),

    ...

    Field('description', 'text', widget=hideable_ckeditor_widget())
    )  

[Serge Bourgeois]

Thanks for your response.

The solution I'm looking for should preserve the way ckeditor displays the text. 

Based on you idea, I tried this in my controller:

db.my_table.my_field.represent = lambda value, row:  ckeditor.widget(db.my_table.my_field, value, **{'_name':'my_field_row_%s' % row.id }) if 'new' in request.args or 'edit' in request.args  else text_widget(db.my_table.my_field, value, **{'_name':'my_field_row_%s' % row.id}).add_class('width250px' 'height50px')

( .. I added widht250px and height50px in the head of layout.html)

 

Mybe I missed some points in your suggestion ?

The result of this test leads to loosing the text format and displaying the tags ... 

Example of what displays on the screen for 'my_field':

<p>

This is my text <strong>this is a strong text including an image:&nbsp;<img alt="" src="/prj/default/download/plugin_ckeditor_upload.upload.bfe9ba00ebcb13a7.44657365727665546f42654c6f7665642e6d7033.mp3" /></strong></p>

<p>

&nbsp;</p>

--

[Serge Bourgeois]

If I could find a way to add a way to change, in the view this 

<td id="cke_top_my_table_my_field" class="cke_top" role="presentation"><div class="cke_toolbox" role="group" aria-labelledby="cke_6" onmousedown="return false;"><span id="cke_6"  

by this:

<td id="cke_top_my_table_my_field" class="cke_top hide" role="presentation"><div class="cke_toolbox" role="group" aria-labelledby="cke_6" onmousedown="return false;"><span id="cke_6" 

then I woujld add this in the style definition of layout.html 

.hide {display:none !important;}

and it would work...

Any suggestion on how I could add 'hide' in the class?

[Serge Bourgeois]

I'd like to share the solution I found (maybe not the best?), in case it could be usefull to other:

1. collapse the top bar  either with editing the app/static/plugin_ckeditor/config.js file like this:

CKEDITOR.editorConfig = function( config )

{

// Define changes to default configuration here. For example:

// config.language = 'fr';

// config.uiColor = '#AADC6E';

config.toolbarStartupExpanded = false; // added to callapse the top toolbar

};

or by adding this script in the views where you want to hide the top toolbar (more flexible, since you can easily control when it has to be triggered in the view)

<script>

window.onload = function hide_cke_top() {

var my_list = document.getElementsByClassName("cke_top"); // hide top tool bar. 

for (var i = 0; i < my_list.length; i++) {

my_list[i].className += " " + "hide";

};

};

</script>

2. In the controller : db.my_table.my_text_field.represent = lambda value, row: ckeditor.widget(db.my_table.my_text_field, value, **{'_id': 'ckeditor_row_%s' % row.id, '_name':'my_text_field_row_%s' % row.id }) if (.. here your condition to make the field editable) else (ckeditor.widget(db.my_table.my_text_field, value, **{'_id': 'ckeditor_row_%s' % row.id,'_name':'my_text_field_row_%s' % row.id, '_disabled' : 'disabled' }))

Hope this can help...

Serge

To unsubscribe from this group and all its topics, send an email to web2py+unsubscribe@googlegroups.com.