Function append vs javascript [duplicate]

Question

Function append vs javascript [duplicate]

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I have a page that generates a form dynamically using append('texto html');

These inputs that I generate after loading the page completely, I can not by them invoke functions js created in the ready of the page, that is, before the inputs exist.

ex: I create a named form and cpf and the save button using append.

In my script there already exists a salvar(){} method and at the time I create the button in onclick, I call the save () function, but it does not work. I think because the input was being created after the page load. Can you do something to fix this?

<script type='text/javascript'>
                    $( document ).ready(function() {

$('#confirm_edit').click(function(){

 $('#form_execucao').append('<br class=\"campos bts\" /><br class=\"campos bts\" />');
                                $('#form_execucao').append('<label id=\"bt_print\" name=\"bt_print\" onclick=\"pt()\" style=\"margin-left:5px; height:30px; font: normal 13px Verdana, Arial, Times;\" for=\"salvar\" class=\"btn btn-primary campos bts\"><i class=\"glyphicon glyphicon-print\"></i> Imprimir</label>');
                                $('#form_execucao').append('<label id=\"bt_salvar\" name=\"bt_salvar\" onclick=\"sv()\" style=\"margin-left:10px; height:30px; font: normal 13px Verdana, Arial, Times;\" for=\"salvar\" class=\"btn btn-info campos bts\"><i class=\"glyphicon glyphicon-floppy-disk\"></i> Salvar</label>');

});

                    function pt(){
                        alert('imprimindo');
                    }

                    function sv(){
                        alert('salvando');    
                    }

 });
</script>

javascript append

asked by anonymous 24.08.2017 / 16:21

2 answers

Session library for NodeJS / HapiJS? How to post for how many hours the post has been posted?

score 1 · Answer 1

Your code contains errors, so it does not work.

Take the escape bars "\" out of append . They are not necessary since you are using single quotation marks as a delimiter.

You do not need $(document).ready(function(){} . The .click() will normally be assigned to the page load.

Your code looks like this:

$('#confirm_edit').click(function(){
	$('#form_execucao').append('<br class="campos bts" /><br class="campos bts" />');
	$('#form_execucao').append('<label id="bt_print" name="bt_print" onclick="pt()" style="margin-left:5px; height:30px; font: normal 13px Verdana, Arial, Times;" for="salvar" class="btn btn-primary campos bts"><i class="glyphicon glyphicon-print"></i> Imprimir</label>');
	$('#form_execucao').append('<label id="bt_salvar" name="bt_salvar" onclick="sv()" style="margin-left:10px; height:30px; font: normal 13px Verdana, Arial, Times;" for="salvar" class="btn btn-info campos bts"><i class="glyphicon glyphicon-floppy-disk"></i> Salvar</label>');
	});

function pt(){
	alert('imprimindo');
}

function sv(){
	alert('salvando');    
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><linkrel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<input type="button" value="ok" id="confirm_edit" />
<div id="form_execucao"></div>

score 0 · Answer 2

You have to bind in the line below the append, by connecting the button with the function already created

$(document).ready(function() {
  function save() {
    alert('Save!');
  }

  $('#append').click(function(){
    var btn = '<button id="salvar">Salvar</button>'
    $('#container').html(btn);
    $('#salvar').click(save);
  })
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>