append(html) not working with script

Question

With my append(html) code I would like to be able to include <script></script>

Question: How can I use the <script></script> will not allow me to add them.

As you can see at bottom of addContent() i need to include $("#page_code[' + content_row + ']").summernote({height: 300});

Script

<script type="text/javascript">
var content_row = <?php echo $content_row; ?>;

//$(document).ready(function() {
//    $('#page_code').summernote({height: 300});
//});    

function addContent() {
    html = '<div id="content-row">';
    html += '<div class="form-group">';
    html += '<label class="col-sm-2">Page Content Name</label>';
    html += '<div class="col-sm-10">'; 
    html += '<input type="text" class="form-control" name="page_code[' + content_row + '][name]" placeholder="Page Content Name">';
    html += '</div>';
    html += '</div>';
    html += '<div class="form-group">';
    html += '<label class="col-sm-2">Page Content</label>';
    html += '<div class="col-sm-10">'; 
    html += '<textarea class="form-control" id="page_code[' + content_row + ']" name="page_code[' + content_row + '][code]" style="height: 300px;"></textarea>';
    html += '</div>';
    html += '</div>';
    html += '<script>$("#page_code[' + content_row + ']").summernote({height: 300});</script>';
    html += '</div>';
    $('#content-row').append(html);

    content_row++;
}
</script>

this is happening because element
has not already been there and you are creating it in this function only — abhi, May 09 '15 at 10:19

score 2 · Answer 1 · answered May 09 '15 at 10:19

Jquery provide the html() method that allows you to append, in the given html element, some html. So, you can try with this : http://api.jquery.com/html/

Then, there are some confusions in the part of code that is the reason of your problem:

html += '<script>$("#page_code[' + content_row + ']").summernote({height: 300});</script>';

I think that your selection with "#page_code[..]" for an id is wrong. Because you don't have any element with this id, but with the name attribut "page_code[...]". So, even if your tag will be evaluate, your code seems to be wrong.

To select a tag by his name attribut, you can deal with a specific jquery selector : http://api.jquery.com/attribute-equals-selector/

I hope this will help you.

score 2 · Accepted Answer · answered May 09 '15 at 10:22

2

First of all when you are closing your script tag in the string ->

"</script>"

this is an error because "/" in strings is used for escaping, so when closing your tag you should do it

"<//script>"

Second of all - your addContent function is not called?

answered May 09 '15 at 10:22

Pavel Kolev

111
8

As an addition: To avoid the escaping, i would suggest something like this: `var html = $(' – Tyr May 09 '15 at 10:28
@Pavel Kolev it is called my function I just have only put the script where problem is on post. – May 09 '15 at 10:38

append(html) not working with script

2 Answers2