Quill strips out simple html when dangerouslyPasteHTML into editor - 


<style> #editor-container {   height: 375px; } .link {   color:blue; } </style>  <div id="editor-container">   test </div>  <script type="text/javascript"> var quill = new quill('#editor-container', {   modules: {     toolbar: [       [{ header: [1, 2, false] }],       ['bold', 'italic', 'underline'],       ['image', 'code-block']     ]   },   placeholder: 'compose epic...',   theme: 'bubble'  // or 'bubble' });  quill.clipboard.dangerouslypastehtml(5, "<span class=\"link\" data-test=\"test\">testing</span>", "silent"); </script>

mvce - https://codepen.io/anon/pen/qmqmee

the html stripped out despite being pretty harmless (this handled better later).

my current plan, due way quill not allow pasted html, (as part of click action on mentioned person's name):

    $("#tag-selectable-users-list li").on("click",         function() {             var $this = $(this);             var startindex = $this.data("data-start-index");             var username = $this.data("data-user-name");             var userid = $this.data("data-user-id");             var taggeduserids = $("#hiddentaggedusers");             taggeduserids.val((taggeduserids.val()||"") + ";" + userid);             var delta = [];             if (startindex > 0) {                 //retain tag start                 delta.push({ retain: parseint(startindex) });             }             //delete junk             delta.push({ delete: tagstatus.total.length });             //insert new characters             delta.push({                 insert: "@@" + username,                 attributes: {                     color: "blue",                     underline: "true"                 }             });             //insert blank space end span             delta.push({ insert: " " });              quill.updatecontents(delta,                 'api');         });     }

Comments

Post a Comment

Popular posts from this blog

angular - DownloadURL return null in below code -

when change file updated in firebase storage when try downloadurl show null. filechange(event: any) { const imagefolder: string = this.employee.id; const filelist: filelist = event.target.files; const file: file = filelist[0]; const storageref = firebase.storage().ref().child(`${imagefolder}/profile.jpg`).put(file); console.log(storageref.snapshot.downloadurl); } the put() asynchronous. if want url after file uploaded have this: firebase.storage().ref().child(`${imagefolder}/profile.jpg`).put(file).then((snapshot) => { storageref = snapshot.downloadurl: console.log(snapshot.downloadurl); });
Read more

meteor - inserting data to database gives error "insert failed: Method '/texts/insert' not found" -

i have other project broke somehow(i have no idea) , rebuilt app same file names , code , working fine. problem when go insert data database called texts error insert failed: method '/texts/insert' not found not know wrong because copied every line of code previous project , problem came wasn't there before. confuses me when create user accounts accounts.createuser() works fine. sendtext.js import react "react"; import {texts} "./../api/text"; import {withrouter} 'react-router-dom'; import {meteor} "meteor/meteor"; import {accounts} "meteor/accounts-base" class sendtext extends react.component{ send(e){ e.preventdefault(); let message = this.refs.message.value; let name = accounts.user().username if(name != ""){ if(message){ texts.insert({ name, message }); this.refs.m...
Read more