CODEWITHSUNDEEP
jqueryasp.net-mvctwitter-bootstrap
Ritesh Gupta
Ritesh Gupta

Reputation: 171

Bootstrap Popup in mvc

I want to open popup using bootstrap in mvc on click of ActionLink. Here is my code-

@Html.ActionLink("Create New", "Bootstrap", null, new { @class = ".mymodal" })

@using (Html.BeginForm())
{
<div class="modal fade mymodal">
    <div class="modal-dialog">
        <div class="modal-content">
          //Next lines of code
   </div>
</div>
</div>
}

but popup is not going to open. Well its opening on click of button given below-

<a class="btn btn-success" data-toggle="modal" data-target=".mymodal"> <span class="glyphicon glyphicon-eye-open"></span>View</a>

Upvotes: 0

Views: 281

Answers (3)

monstertjie_za
monstertjie_za

Reputation: 7803

You need to add those data attributes to your ActionLink HtmlAttributes, as follow.

@Html.ActionLink("Create New", "Bootstrap", null, new { @class = "btn btn-success", data-toggle="modal", data-target=".mymodal", id = "yourButtonID"  })

You can also define a click event for your ActionLink in JQuery, and call a JQuery method to open Modal, as follow: Please note that you need to give your ActionLink a id in the HtmlAttributes, as specified:

$(function () {
    $(document)
        .on("click", "#yourButtonID", function () {
            showModal();
    });

    function showModal() {
        //set options here if needed.
        $("#YourModalID").modal('show');
    }
})

Upvotes: 1

Jitendra Tiwari
Jitendra Tiwari

Reputation: 1691

Update you anchor tag with this one

@Html.ActionLink("Create New", "Bootstrap", null, new { @class="btn btn-success" data-toggle="modal" data-target=".mymodal" })

Upvotes: 0

miechooy
miechooy

Reputation: 3422

Give ID to your modal and run trigger like

$("#modal").modal("show");

Upvotes: 0

Related Questions