TinyMce编辑器不允许html标签

Question

I'm using TinyMce editor and trying to copy paste some html tags and store in Database, but the problem is, it is removing bootstrap accordian code automaticly

<script>
tinymce.init({
forced_root_blocks: false,
selector: "textarea#cmshtml",
relative_urls: false,
convert_urls: false,
forced_root_block : false,
force_p_newlines : false,
width : "320",
height : "290",
remove_script_host: false,
document_base_url: base_url,
plugins: [
    "advlist autolink lists link image charmap print preview anchor",
    "searchreplace visualblocks code fullscreen",
    "insertdatetime media table contextmenu paste"
],
valid_elements : '*[*]',    
toolbar: "anchor | insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link "
        });
</script>

Original data-

<div class="panel-group" id="accordion">
<div class="panel panel-default">
    <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">
        <div class="panel-heading">
            <div class="panel-title">
            <span class="glyphicon glyphicon-minus iconclr"></span>
            What is Lorem Ipsum?                
            </div>
        </div>
    </a>
  <div id="collapse1" class="panel-collapse collapse in">
    <div class="panel-body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
  </div>
</div>
<div class="panel panel-default">
    <a data-toggle="collapse" data-parent="#accordion" href="#collapse2" >
      <div class="panel-heading">
        <div class="panel-title">
          <span class="glyphicon glyphicon-plus iconclr"></span>
          Why do we use it?           
        </div>
      </div>
    </a>
  <div id="collapse2" class="panel-collapse collapse">
    <div class="panel-body">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
  </div>
</div>

When i am trying to copy paste above code in editor and try to save it removes accordian and give me below result

Output data-

<div class="panel-group" id="accordion">
<div class="panel panel-default">
    <div class="panel-heading">
        <div class="panel-title">
        <span class="glyphicon glyphicon-minus iconclr"></span>
        What is Lorem Ipsum?                
        </div>
    </div>
  <div id="collapse1" class="panel-collapse collapse in">
    <div class="panel-body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
  </div>
</div>
<div class="panel panel-default">
  <div class="panel-heading">
    <div class="panel-title">
      <span class="glyphicon glyphicon-plus iconclr"></span>
      Why do we use it?           
    </div>
  </div>
  <div id="collapse2" class="panel-collapse collapse">
    <div class="panel-body">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
  </div>
</div>

Can anyone please give some suggestion ?

Answer 1

Try to use full XHTML rule set for valid_elements from tinyMce Docs . I use default rule set but delete all properties added to a. See on fiddle .