CODEWITHSUNDEEP
jqueryhtmlwordpress
Juri
Juri

Reputation: 331

Add a table in a wordpress article using jquery

Using jQuery in a Wordpress article/page (without break-line and in jQuery's Compatibility Mode), why can I insert any plain text, but not DIRECTLY a html tag for example a <p> or a <table> using appropriate jQuery method (html)?

For example, in Wordpress, the following code doesn't work:

$(".div_import_text").html("New text");
$(".div_import_table").html("<table><tr><th><p>1</p></th><th><p>2</p></th></tr><tr><td>A</td> <td>B</td></tr></table>");
table, tr, th, td {
  border: 1px solid black;
 }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="div_import_text">Old text</div>
<div class="div_import_table">Old table</div>

There are non problems, however, to insert formatted text and html tags INDIRECTLY (for example, by copying it from another Wordpress page/article, for example using the jQuery method get). Why? Is it for safety reasons, as seems to say this post? https://stackoverflow.com/a/2075942/7208844

So why allow the INDIRECT inclusion of content by importing it from other Wordpress page through the jQuery method get mentioned?

Sorry for the long question and thanks for your time.

Upvotes: 0

Views: 70

Answers (2)

Juri
Juri

Reputation: 331

I solved it this way: I published the <table> in another wordpress page and then I imported it in the <div> using the jQuery method get.

<script>
jQuery(document).ready(function($){
 $.get("external-wordpress-page",function(res){ 
  $(".table").html($(res).find('.table'));
 },'html');
})
</script>

Thank you all anyway

Upvotes: 0

madalinivascu
madalinivascu

Reputation: 32354

Wordpress seems to add each html element from a string to a new line which breaks the javascript, i suggest you create a custom shortcode with your javascript and append that to your post

Upvotes: 1

Related Questions