Pass value from button to modal

0

I need help in the javascript code, I'm new and I do not know the syntax. What I need is to get the value of this button and play on the label id_user, how do I do it?

<button data-target="modal1" class="negar" value="{{item.id}}" class="btn modal-trigger blue"><i class=" large material-icons ">clear</i

    <!-- Modal Structure -->
    <div id="modal1" class="modal">
        <div class="modal-content">
            <h4>Motivo</h4>
            <form method="POST" action="." class="viewform" id="formMotivo">
              <label id=id_usuario> </label>
                <button type="submit" name="salvar" class="btn btn-primary btn-lg">Salvar</button>    
            </form>
        </div>
        <div class="modal-footer"></div>
    </div>
    script>

             $(document).ready(function(){


      **document.getElementById("id_usuario").innerHTML = btn(negar).value;**

             });
    
asked by anonymous 28.09.2017 / 15:16

2 answers

0

As you use JQuery, you can use an attribute of type data- * , transforming it in:

<button data-itemid="{{item.id}}" onclick="OpenModalFor(this)"></button>

And retrieve the value in the function as follows:

function OpenModalFor(clicked_button) {
   var item_id = $(clicked_button).data('itemid');
   $('#id_usuario').text(item_id);
}
    
28.09.2017 / 16:03
0

The @Isac comment is pertinent, because if you do not need interaction you could only use {{item.id}} directly in label . But I'll consider that you've just simplified the question.

I think you could do this:

document.getElementById("id_usuario").innerHTML = document.getElementsByClassName("negar")[0].getAttribute("value");

But seeing your code using JQuery, I think it would be better if you standardized the use of it.

Looking like this:

$("#id_usuario").text($(".negar").attr("value"));

Snippet:

<button data-target="modal1" class="negar" value="{{item.id}}" class="btn modal-trigger blue">
  <i class=" large material-icons ">clear</i>
</button>
<!-- Modal Structure -->
<div id="modal1" class="modal">
  <div class="modal-content">
    <h4>Motivo</h4>
    <form method="POST" action="." class="viewform" id="formMotivo">
      <label id=id_usuario></label>
      <button type="submit" name="salvar" class="btn btn-primary btn-lg">Salvar</button>    
    </form>
  </div>
  <div class="modal-footer"></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script>$(document).ready(function(){$("#id_usuario").text($(".negar").attr("value"));
  });
</script>
    
28.09.2017 / 15:51