MVC - view click event is not fired in jquery

Question

I have the below simple code, where I need to trigger an alert when click on the button. But the event is not triggered.

@{
    ViewBag.Title = "Dashboard";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>

    $("#btnclickhere").click(function (e) {
        alert(1);
        e.stopPropagation(); // This is the preferred method.
        return false;        // This should not be used unless you do not want
        // any click events registering inside the div
    });
</script>
<h2>Dashboard</h2>
<table>
    <tbody>
        <tr>

            <td>
                <input type="text" id="textname" name="txtname" />
            </td>
            <td>
                <input type="text" id="textpassword" name="textpassword" />
            </td>
            <td>
                <input type="button" id="btnclickhere" name="btnclickhere" value="ClickHere" />
            </td>
        </tr>
    </tbody>
</table>

Can someone help me to figure out the issue here?

Andrew · Accepted Answer · 2017-03-27 15:54:14Z

1

The script is loaded before the html tags, so there is nothing called #btnclickhere at the time you ask jQuery to register the click handler. You should wrap your jquery code in a $(document).ready(function(){/your code here/}); event handler to ensure the DOM is fully populated before querying.

answered Mar 27, 2017 at 15:54

Andrew

6172 gold badges6 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

MVC - view click event is not fired in jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related