How can I get CKEditor to update my database data object when I look at Source?

Question

When my users make changes to the edit window, it seems that the backup data object is constantly being updated. However, when the user clicks on [SOURCE] and makes changes, it seems that there is no update.

I added the following to my code:

ck.on('mode', function () { $scope.$apply(function () { ngModel.$setViewValue(ck.getData()); }); }); 

This means that the user returns from [SOURCE] to the normal viewing mode, and when this happens, he updates my data.

However, when the user remains in the [SOURCE] view and clicks on my screen, he does not receive the latest changes. Is there a way to listen for changes in the [SOURCE] view and then update my background storage since those changes are made?

Answer 1

You can watch @ https://github.com/esvit/ng-ckeditor

Ready to use Ckeditor Directive

Answer 2

You can always add the “blur” directive and get data from [SOURCE] when blurring ...

 app.directive('blur', function () { return function (scope, elem, attrs) { elem.on('change', function () { scope.$apply(attrs.blur); }); }; }); $scope.getCkData = function () {$scope.ckData = ck.getData();}; <textarea id="editor1" name="editor1" blur="getCkData()">Default</textarea> 

Now, looking at the CK Editor, when you click the "source" button in the editor window, a new text field is superimposed. Thus, you may need to add blur using the jquery selector.

 $('#editor1 > textarea').attr('blur', 'getCkData()'); 

Thus, whenever someone leaves the original or wysiwyg view, the model is updated.