Open Bootstrap Modal Popup on Button Mouseover (Mouse Hover) using C# and VB.Net in ASP.Net

Last Reply one month ago By dharmendr

Posted one month ago

Hello.

Is it possible to have a modal popup on mouseover event of a button in c#?

Please help me to implement the same.

Thanks

You are viewing reply posted by: dharmendr one month ago.
Posted one month ago

Hi sat,

Check this example. Now please take its reference and correct your code.

HTML

<script type="text/javascript" src='https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js'></script>
<script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js'></script>
<link rel="stylesheet" media="screen" href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css' />
<script type="text/javascript">
    function ShowPopup() {
        $("[id*=MyPopup]").modal("show");
    }
</script>
<center>
    <asp:Button ID="btnShowPopup" runat="server" Text="Show Popup" CssClass="btn btn-info btn-lg" />
</center>
<!-- Modal Popup -->
<div id="MyPopup" class="modal fade" 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 Title.
                </h4>
            </div>
            <div class="modal-body">
                Modal Body.
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal Popup -->

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    // Assigned mouse hover event to Bitton.
    btnShowPopup.Attributes.Add("onmouseover", "ShowPopup();");
}

VB.Net

Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
    ' Assigned mouse hover event to Bitton.
    btnShowPopup.Attributes.Add("onmouseover", "ShowPopup();")
End Sub

Screenshot