CKEditor CDN

[Alex Glaros]

CKEditor is now available from CDN: http://cdn.ckeditor.com/

can someone please provide example of how to integrate into w2p?

is it safe, if not, way to sanitize?

thanks,

Alex Glaros

[Michael Beller]

I add this to my base template:

<script>
 // Replace the textarea with a CKEditor instance (replace 'content_body' with the id of your textarea)
 CKEDITOR.replace('content_body', {
 height: 500,
 contentsCss: '{{=URL('static','css/contract.css')}}',
 format_tags: 'p;h1;h2;h3;h4;div',
 });
</script>

[Alex Glaros]

It's looking better Michael but based on code example below, could you please help with:

1. Remind me how to get the updated text from textarea back into the table

2. the fromat_tags parm,, seems that purpose is to limit what user can do?  If yes, don't seem to make the rest of the tags disappear.

<script src="https://cdn.ckeditor.com/4.6.2/standard/ckeditor.js"></script>

<textarea name="z">{{=person.summary_self_description}}</textarea>

<script>

  CKEDITOR.replace('z', {

    height: 500,

    contentsCss: '{{=URL('static','css/contract.css')}}',

    format_tags: 'p;h1;h2;h3;h4;div',

  });

</script>

thanks,

Alex

[Michael Beller]

I created a custom css file and limited the tags available in the example I posted, you can remove those arguments and you'll get the ckeditor defaults.

If you're using SQLFORM then the text field is updated automatically along with any other form field - there's no special processing you have to handle.  If it's a custom form, then you can access the form field in form.vars.

I just looked and the fields I use with ckeditor I define as follows:

Field(
 'body', 'text', length=70000,
 represent=lambda v, r: XML(v, sanitize=True)
),

[Alex Glaros]

gap in my understanding:

how to get var "z", textarea content into w2p field person.summary_self_description ?

When I used to use ckEditor as a plug-in, looked like this in controller:

def ckedit(field, value): 

    return TEXTAREA(_id = str(field).replace('.','_'), _name = field.name, 

                  _class = 'text ckeditor', value = XML(value, sanitize = False), _cols = 800, _rows = 10)

and looked like this in db

Field('summary_self_description','text', label = 'About', widget=ckeditor.widget),

but using a CDN, what is syntax?

thanks

Alex

[Dave S]

Is the syntax going to change, or just the link header to load the code?

/dps
 

[Alex Glaros]

Not sure what you mean, I don't want to use the plug-in any more; just use the CDN.

Whatever it take to do that, I'll change, unless security is not good.

[Dave S]

On Friday, April 14, 2017 at 1:47:04 PM UTC-7, Alex Glaros wrote:

Not sure what you mean, I don't want to use the plug-in any more; just use the CDN.

Whatever it take to do that, I'll change, unless security is not good.

What I mean is "CDN" means "Content Delivery Network".   They host the javascript files so that your server doesn't have to.  It is the same javascript file (except for updates). 

Note that the site you referenced only documents how to load the editor.  You have to go to the CKEditor.com site
to get documentation on the editor itself.

/dps
 

[Alex Glaros]

I think is the same.

Works great, but once I have the edited content, I don't know how to load it into the table

[Dave S]

On Friday, April 14, 2017 at 3:17:57 PM UTC-7, Alex Glaros wrote:

I think is the same.

Works great, but once I have the edited content, I don't know how to load it into the table

HTTP POST?

/dps
 

[Alex Glaros]

Dave, there's a gap in my skill level to understand your question.  Can I please ask for an example?

[Dave S]

On Friday, April 14, 2017 at 4:07:58 PM UTC-7, Alex Glaros wrote:

Dave, there's a gap in my skill level to understand your question.  Can I please ask for an example?

A textarea, which is what it looks like CKEditor manipulates, is an input field in a form.  The submit button for a form normally leads to an HTTP POST request being sent to your server, where a controller (specified by the form action) would see that textarea as POST DATA (request.post_vars[TAname] or request.post_vars.TAname)

The submit button could be a "plain vanilla" submit button with the browser handling all the lifting, or it could be a jQuery/ajax button with a little script to fire off the POST (perhaps without leaving the page).

A simple example of posting a form would be the "Say my name" exercise in Chapter 3, but any of the form tools in Chapter 7 should work, also.

I have a page (on another machine, so no cuttenpaist at this time) where I have 2 forms (both SQLFORM instances).  For one of them, the submit button is the default one and you leave the page (except the next action is back to that page).  For the other, the submit button is wired through jQuery and only the DIV containing it is updated.  2 different functions in my controller.

Dave
/dps

[Alex Glaros]

thanks Dave, below worked, but sanitize=True removes tables and other elements that user creates so I have to read  documentation on how to remove those buttons from the toolbar.

<script src="https://cdn.ckeditor.com/4.6.2/standard/ckeditor.js"></script>

<h1>Enter information about yourself</h1>

<form action="{{=URL('view_user_profile', args=auth.user_id, vars=dict(z=z))}}">

<textarea name="z">{{=person.summary_self_description}}</textarea>

<script>

  CKEDITOR.replace('z', {

    height: 500,

    contentsCss: '{{=URL('static','css/contract.css')}}',

    format_tags: 'p;h1;h2;h3;h4;div',

  });

</script>

  <input type="submit" />

</form>

[Alex Glaros]

"basic" works to fix sanitation problem

<script src="https://cdn.ckeditor.com/4.6.2/basic/ckeditor.js"></script>

[Dave S]

On Sunday, April 16, 2017 at 7:19:53 PM UTC-7, Alex Glaros wrote:

"basic" works to fix sanitation problem

<script src="https://cdn.ckeditor.com/4.6.2/basic/ckeditor.js"></script>

Glad you got it working.

/dps