Javascript set value in Modal Bootstrap

Navigation
1

I have the following javascript code: 

function chamarModal(valor) {

    $('span.nome').text(valor);
    $('#pagamento-modal').modal();
}

How do I set this content of the valor variable in my modal bootstrap?

I tried the above code and other codes and it did not work

My modal: 

<div class="modal fade" id="pagamento-modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Fechar"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="modalLabel">Registrar Pagamento</h4>
                        </div>
                        <div class="modal-body">Deseja realmente registrar o pagamento no valor de  <b><span class="nome"></span></b>? </div>
                        <div class="modal-footer">
                            <a href="#" type="button"  class="btn btn-primary pay-yes">Sim</a>
                            <button type="button" class="btn btn-default" data-dismiss="modal">N&atilde;o</button>
                        </div>
                    </div>
                </div>
            </div>

I want to insert in this block: 

<div class="modal-body">Deseja realmente registrar o pagamento no valor de  <b><span class="nome"></span></b>? </div>
    
asked by anonymous 22.03.2017 / 03:10

3 answers

1

Just add a id to < span> , which will work.

Example: 

$("#nome").text("13,13");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><divclass="modal-body">

  Deseja realmente registrar o pagamento no valor de <b>
  <span id="nome" class="nome"></span></b> ?

</div>
    
18.05.2017 / 18:39
0

I'm not seeing where this variable is being defined in your code. But if what you're trying to do is get the value of a string and add it to the DOM, you can do it as follows: 

var resultado = '464866';
document.getElementsByClassName('nome')[0].innerHTML = resultado;
<div class="modal-body">Deseja realmente registrar o pagamento no valor de <b><span class="nome"></span></b> ? </div>

If the case is to get the content / value of an element that is already implemented in the DOM: 

var resultado = document.getElementsByClassName('nome')[0].innerHTML;
document.getElementById('montante_pagar').innerHTML = resultado;
<div class="modal-body">Deseja realmente registrar o pagamento no valor de  <b><span class="nome">464866</span></b>? </div>
<br>
<h3>Montante a pagar: <span id="montante_pagar"></span></h3>

If the case is to obtain the value of a input : 

document.getElementById('botao').addEventListener("click", minhaFuncao);

function minhaFuncao() {
    var resultado = document.getElementById('obtemValor').value;
    document.getElementsByClassName('nome')[0].innerHTML = resultado;
}
<p>quantia a adicionar: <input type="number" id="obtemValor"/></p>
<div class="modal-body">Deseja realmente registrar o pagamento no valor de  <b><span class="nome"></span></b>? </div>
<button id="botao">traz o valor</button>
    
22.03.2017 / 05:13
0

I will respond more like debugging. As I see your code is functional, then the problem is elsewhere. not the snippet of code you provided.

Use the browser console and run the lines one by one, analyzing in the elements tab if the values that will change are those of what you are setting.

Another possibility is that its modal is not defined in the document but in a variable and the code that passed us is just an example. To avoid this possible problem try your code as well 

function chamarModal(valor) {
    $('#pagamento-modal').modal().find('span.nome').text(valor);
}
    
22.03.2017 / 05:17
Which library to use to pause the system instead of getch? How to check if the user logged in 1 hour ago or is logged in