Change Values in Modal - C # MVC JavaScript

Question

Change Values in Modal - C # MVC JavaScript

Navigation

#1 by (5 votes)

1

I have the following javascript code in my project that takes attribute values when the user clicks the rename class button and calls a modal:

<script type="text/javascript">
$('.rename').on('click', function () {
    var $this = $(this);
    var nome = $this.attr('data-name');
    var id = $this.attr('data-id');
    document.getElementById("nome_marca").innerHTML = nome";
    $('#id_marca').attr("value", id); 
    $('#myModal').modal('show'); 
});</script>

In the modal, briefly, I have the following structure

Link that the user will click on the table to call the modal:

 <a class="rename" data-toggle="modal" href="#myModal" data-name="@Html.DisplayFor(model => item.nomeMarca)" 
                               data-id="@Html.DisplayFor(model => item.id)"><span class="glyphicon glyphicon-edit">
                                </span>Renomear</a>

Modal Header:

 <h4 class="modal-title">Digite o novo nome para a Marca <span id="nome_marca"></span></h4>

Rename Form:

 <form method="post" id="form_rename" action="/Marca/RenomearMarca">
            <div class="modal-body">                    
                <div class="form-group">     
                    <input type="hidden" name="idMarca" id="id_marca" />                   
                    <input type="text" name="nomeMarca" required class="form-control" />
                </div>                    
            </div>
            <div class="modal-footer">                    
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                <input type="submit" class="btn btn-primary" value="Renomear"/>
            </div></form>

I want the user to click on the rename class button to get the values of the data-name and data-id attributes and send them to the modal. Making the span of nome_marca id be displayed, for example, "Enter the new name for the [Asus] tag" and input hidden to get the value of the data-id attribute.

I have tried it in every way but the values are not passing. What's missing in the code to work?

javascript c# asp.net-mvc modal bootstrap

asked by anonymous 05.04.2017 / 10:13

1 answer

What is the name of this part of the code? Calculate difference between two dates - I can not convert the date of the database to DateTime

score 5 · Accepted Answer

<script type="text/javascript">
$(document).ready(function(){
    $(document).on("click", ".rename", function() {
        var $this = $(this);
        var nome = $this.data('name');
        var id = $this.data('id');
        $("#nome_marca").text(nome);  
        $('#id_marca').val(id); 
        $('#myModal').modal(); 
    });
});
</script>

Considering that the clicked element has the data: name and id attributes.

I suggest that you publish the part of the code where you get those values as well, it gets easier there. (=