C# MVC call javascript function on click

Question

How to we call a function from an external JS file on click?

JS file on /Content/js/pj_no.js

function alertMe(){
    alert("me");
}

C#

@Scripts.Render("~/Content/js/pj_no.js")
<input value="親コード新規登録" type="button" onclick="alertMe()" />

Assuming this is in the same file iin my csHTML it is working fine. But when I put it on the external JS it is not calling anymore.

I know my JS is in the right directory as if i trigger an $(document).ready(function () {} it is calling the alert. But I need it to be on click event.

Help please

$(document).ready(function (
alert("me"); -- This is working,

function alertMe(){ //cant call this function
    alert("me");
}
)});

have you check if your javascript file loaded? you can check it using developer tools in the browser. e.g Press F12 — Jeric Cruz
– Jeric Cruz, Commented Apr 25, 2017 at 3:28
Yes it was loaded. I run the same script in the same file $(document).ready(function ( alert("me"); -- This is working, function alertMe(){ //cant call this function alert("me"); } )}); — Rey Norbert Besmonte
– Rey Norbert Besmonte, Commented Apr 25, 2017 at 3:31
Yes. Again in the document.ready, the alert is already working, the function is not. I edited the question :) — Rey Norbert Besmonte
– Rey Norbert Besmonte, Commented Apr 25, 2017 at 3:37

Ashokkumar M. Prajapati · Accepted Answer · 2017-04-25 04:09:05Z

3

$(document).ready(function (
  alert("me"); -- This is working,

  // NOTE: Following becomes local function. and will not work
  function alertMe(){ //cant call this function 
      alert("me");
  }
)});

You need to make it global to get called. Please declare it out side of document ready function.

$(document).ready(function (
  alert("me"); -- This is working,

)});
  // NOTE: Following will work 
  function alertMe(){ 
      alert("me");
  }

answered Apr 25, 2017 at 4:09

Ashokkumar M. Prajapati

4934 silver badges12 bronze badges

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

Comments

Jeric Cruz · Accepted Answer · 2017-04-25 03:32:56Z

0

you can bundle it first in App_Start > BundleConfig.cs inside RegisterBundles

bundles.Add(new ScriptBundle("~/bundles/pj_no").Include(
                        "~/Content/js/pj_no.js"));

then you can call it in your view :

@Scripts.Render("~/bundles/pj_no")
<input value="親コード新規登録" type="button" onclick="alertMe()" />

answered Apr 25, 2017 at 3:32

Jeric Cruz

1,9071 gold badge16 silver badges30 bronze badges

1 Comment

Rey Norbert Besmonte Over a year ago

already added the bundle in the folder. The JS file is already being called, i just cant call the function

Prashant-Systematix · Accepted Answer · 2017-04-25 03:56:43Z

0

You just need to simply put the external js function in script folder.

Then simply call include it on view

@Scripts.Render("~/Scripts/pj_no.js")

Then simply call the function on onclick

<input value="親コード新規登録" type="button" onclick="alertMe()" />

edited Apr 25, 2017 at 3:56

answered Apr 25, 2017 at 3:50

Prashant-Systematix

2692 silver badges5 bronze badges

1 Comment

Prashant-Systematix Over a year ago

Let me know if any query

Kira · Accepted Answer · 2017-04-25 04:05:29Z

0

Try the following code, it will work

window.alertMe = function(){ //can call this function
    alert("me");
}

Your code is not working because your function gets added to the local scope of $.ready function. By using window.alertMe your function will be added to global scope even if it is inside the $.ready method

answered Apr 25, 2017 at 4:05

Kira

1,4431 gold badge18 silver badges47 bronze badges

Comments

Rey Norbert Besmonte · Accepted Answer · 2017-04-25 04:16:02Z

0

It is working now with this way.

In MVC we rarely uses onclick event on input element, usually we use jQuery like this:

$("#elementname").click(function () {
 alertMe(); 
});
<input value="親コード新規登録" type="button" id="elementname" />.

– Tetsuya Yamamoto

answered Apr 25, 2017 at 4:16

Rey Norbert Besmonte

8113 gold badges15 silver badges30 bronze badges

Collectives™ on Stack Overflow

C# MVC call javascript function on click

5 Answers 5

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related