2017-12-01 1 views
0

Ich habe tinymce in meiner Website eingestellt, so dass der Benutzer die Symbolleiste beim Schreiben von Text sowie zum Hochladen eines Bildes verwenden kann. Leider habe ich das Problem mit Tinymce erkannt.Tinymce speichert den Text nicht so wie er eingegeben wurde

$(document).ready(function() { 
tinymce.init({ 
selector: "#market-product_info, #market-delivery_info, #market-facility_info", 
language_url: '/frontend/web/js/tinymce/langs/zh_CN.js', 
menubar:true, 
statusbar: true, 
relative_urls : false, 
branding: false, 
plugins: [ 
      "advlist autolink lists link image charmap print preview hr anchor pagebreak", 
      "searchreplace wordcount visualblocks visualchars code fullscreen", 
      "save table contextmenu directionality emoticons template paste textcolor", 
      "emoticons template paste textcolor colorpicker textpattern", 
      "save" 
], 
    toolbar1: "undo redo | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | forecolor |styleselect | link unlink anchor |link image | preview code ", 
    image_advtab: true, 
    // enable title field in the Image dialog 


image_title: true, 
    // enable automatic uploads of images represented by blob or data URIs 
    automatic_uploads: true, 
    // URL of our upload handler (for more details check: https://www.tinymce.com/docs/configure/file-image-upload/#images_upload_url) 
    // images_upload_url: 'postAcceptor.php', 
    // here we add custom filepicker only to Image dialog 
    file_picker_types: 'image', 
    // and here's our custom image picker 
    file_picker_callback: function(cb, value, meta) { 
    var input = document.createElement('input'); 
    input.setAttribute('type', 'file'); 
    input.setAttribute('accept', 'image/*'); 

    // Note: In modern browsers input[type="file"] is functional without 
    // even adding it to the DOM, but that might not be the case in some older 
    // or quirky browsers like IE, so you might want to add it to the DOM 
    // just in case, and visually hide it. And do not forget do remove it 
    // once you do not need it anymore. 

    input.onchange = function() { 
     var file = this.files[0]; 

     var reader = new FileReader(); 
     reader.onload = function() { 
     // Note: Now we need to register the blob in TinyMCEs image blob 
     // registry. In the next release this part hopefully won't be 
     // necessary, as we are looking to handle it internally. 
     var id = 'blobid' + (new Date()).getTime(); 
     var blobCache = tinymce.activeEditor.editorUpload.blobCache; 
     var base64 = reader.result.split(',')[1]; 
     var blobInfo = blobCache.create(id, file, base64); 
     blobCache.add(blobInfo); 

     // call the callback and populate the Title field with the file name 
     cb(blobInfo.blobUri(), { title: file.name }); 
     }; 
     reader.readAsDataURL(file); 
    }; 
    input.click(); 
    } 
    }); 
});     

Das Problem ist, wenn ein Benutzer eine Tabelle erstellt oder verwendet keine Symbolleiste Optionen (fett, kursiv, Textfarbe oder etc.) und macht geltend, in der Datenbank der Informationen als Benutzer eingefügt empfangen werden, aber wenn die Benutzer möchte die Informationen bearbeiten und erneut einreichen, dann werden im Textfeld alle Wörter ohne Tabellen- oder Symbolleistenfunktionen angezeigt. Ich möchte es auf eine Art und Weise haben, dass der Benutzer seinen/ihren Text so findet, wie er zuvor gesendet wurde, wenn er/sie den Text bearbeiten möchte.

Antwort

0

Haben Sie versuchen, Textbereich zu erstellen:

<textarea style="width: 100%;" name="description" id="description"></textarea> 

setzte dann Inhalt des Textbereiches:

$('#description').html('<table><tr><th>user info table</th></tr></table>'); 

dann init die tinyMCE:

tinyMCE.init({ 
    // input tinyMCE options 
    ... 
}); 
Verwandte Themen