External js script not working in View (ASP.NET)

Question

I have external js script where for example I writing this code

    $('#save').click(function () {
    alert('Clicked');
});

In view I have button

 <div class="form-group" style="text-align:center">
    <input type="button" id="save" value="Create"  style="border-radius:30px; background: #1d69b4; border-color: #1d69b4;width: 250px; color: white;" class="btn btn-default" style="margin-right: 40px;" />
</div>

In header of View I put scripts like this

 <script src="~/Scripts/jquery-3.2.1.js"></script>
<script src="~/Scripts/HTMLCanvas.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.min.js"></script>
<script src="~/Scripts/PatientDatabaseScripts/AddingPatient.js"></script>

When I click button, it does nothing, any alerts. In dev console no errors.

But when I write alert via function , and in button put code onclick = "save()", all okay.

Where is my problem?

Did you inspect the actual HTML as to what the ID of save actually is? aspnet renames the ID of Controls dynamically. Google what ClientID or ClientIDMode="Static" do — VDWWD
– VDWWD, Commented Jan 29, 2018 at 19:49

Nedim Hozić · Accepted Answer · 2018-01-29 19:49:24Z

1

It might be that you try to attach event handler on the DOM element which is not loaded yet.

The one thing that you can do is wrap your JS in a 'ready' block, like this:

$(document).ready(function(){
    $('#save').click(function () {
      alert('Clicked');
    });
})

answered Jan 29, 2018 at 19:49

Nedim Hozić

1,91115 silver badges15 bronze badges

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

Collectives™ on Stack Overflow

External js script not working in View (ASP.NET)

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