Pass an object to a modal Bootstrap

4

I need to pass a database object to a modal when I open it to show the object information.

Is it possible to do this? follows the cshtml of the view in which the modal button is called, it opens correctly but I can not pass the object information to show on it.

    @foreach (var item in Model)
    {
        <div class="feature-box col-sm-2">
            <ul class="list-group" >
                <li class="list-group-item list-group-item-success">
                    <h5><strong> Sala: @Html.DisplayFor(modelItem => item.Nome)</strong></h5>
                    <button id="btnReservar" type="button" class="btn btn-default navbar-btn" data-toggle="modal" data-target="#mySala">
                        <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
                        Reservar
                    </button>
                </li>
            </ul>
        </div>
     }

My Modal is set, still without the information.

    <div id ="mySala" class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                   <h4 class="modal-title">Sala</h4>
                   </div>
                   <div class="modal-body"><p>Insereir as informações &hellip;</p></div>
                   <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>
</div>

How can I do to pass the item object as well as I use the button in:

     <h5><strong> Sala: @Html.DisplayFor(modelItem => item.Nome)</strong></h5>
    
asked by anonymous 10.12.2015 / 20:10

1 answer

4

I can see 2 paths you can follow:

1 - Use the HTML5 date attribute to pass the data to the modal, via JSON, such as ex. data-meu-atributo="{valor:1, valor2:2} .

2 - Use an Ajax call on the event call open of the modal, as in ex:

  $('#myModal').on('show.bs.modal', function (e) {
        /*chamada ajax aqui ..*/
    });
    
10.12.2015 / 20:38