57021

Tinymce align text buttons don't work on inline editing

Question:

I have the following code :

HTML:

<p id="edit">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

JS :

<script type="text/javascript"> $(document).ready(function(){ tinymce.init({ inline : true, selector : 'p#edit' }); }); </script>

and this is how the toolbar look like :

<img alt="tinymce toolbar" class="b-lazy" data-src="https://i.stack.imgur.com/u9AAT.png" data-original="https://i.stack.imgur.com/u9AAT.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

<strong>text align buttons and bullet list buttons and also indent button are not working</strong>

What's going wrong here ?

Answer1:

I have not tried making a p element as an editor but here's my code with a textarea. The key is that you use the right selector and the correct mode.

HTML:

<div class="form-group"> <div class="col-sm-12"> @Html.TextAreaFor(m => m.MarketingInformation, new { @class = "form-control mceEditor" }) </div> </div>

JS:

<script type="text/javascript"> tinymce.init({ mode: "specific_textareas", editor_selector : "mceEditor", height: 100, plugins: [ "advlist autolink lists link charmap print preview anchor textcolor", "searchreplace visualblocks code fullscreen", "insertdatetime table contextmenu paste textcolor" ], toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | forecolor backcolor" }); </script>

I think if you use the mode as 'exact' it should work but I have not tried that; <a href="http://www.tinymce.com/wiki.php/Configuration3x:mode" rel="nofollow">http://www.tinymce.com/wiki.php/Configuration3x:mode</a>

Recommend