Show Modal Using Html.ActionLink

This post will give you an idea about how can you show a bootsrap modal using Html.ActionLink. I will also show you that how can you call a java script function with argument while showing modal.

Ones you will be able to call java script function while showing modal then you will be able to fetch data from server using ajax.

Hyperlink Code :

@Html.ActionLink("Detail", "_myModal", "Usertask", new { id = item.ID }, new { data_toggle = "modal", data_target = "#myModal", onclick = "test("+item.ID +");" })

Modal  Code

<div class="modal fade" id="myModal" role="dialog">

    <div class="modal-dialog">

   

      <!-- Modal content-->

      <div class="modal-content">

        <div class="modal-header">

          <button type="button" class="close" data-dismiss="modal">&times;</button>

          <h4 class="modal-title">Modal Header</h4>

        </div>

        <div class="modal-body">

          <p>Some text in the modal.</p>

        </div>

        <div class="modal-footer">

          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

        </div>

      </div>

     

    </div>

  </div>

Java Script Function

<script>

        function test(id) {

            alert(id);

        }

</script>

Next Topic