How to call Jquery Plugin function from outside of plugin

Question

I am using asp.net mvc application. From last 2 days i am trying and following some Internet solutions to call the MyPlugin function from outside the JS . Please help me to find what wrong i am doung.

I had added myplugin JS and written some lines of code and now i am trying to access that function from View script.

My View :

<head>
  <script src="~/Scripts/jquery-3.3.1.min.js"></script>
  <script src="~/Scripts/MyPlugin.js"></script>
</head>
<body>
  <div id="divMain" >
  </div>
</body>

<script>
 $(document).ready(function () {

    $("#divMain").MyPlugin();

 });
</script>

MyPlugin JS:

(function ($) {
    $.fn.MyPlugin= function () {
        alert("ready to start!!!!");
    };

})(jQuery);

And This message i got :

"Uncaught TypeError: $(...).MyPlugin is not a function"

Please help me to find a solution of this problem. I want to call that Plugin's function.

I can see that you have not added jQuery on your page.. Please add it before your plugin js and try. — Manprit Singh Sahota
– Manprit Singh Sahota, Commented Jul 18, 2019 at 7:02
The code you've shown works absolutely fine: jsfiddle.net/ke6sy8ux. Have you debugged this at all? Are there any other errors in the console? — Rory McCrossan
– Rory McCrossan, Commented Jul 18, 2019 at 7:32

Manprit Singh Sahota · Accepted Answer · 2019-07-18 07:05:17Z

1

You have to add jquery prior to your plugin js.

<head>
  <script src="~/Scripts/jquery.js"></script>
  <script src="~/Scripts/MyPlugin.js"></script>
</head>
<body>
  <div id="divMain" >
  </div>
</body>

<script>
 $(document).ready(function () {

    $("#divMain").MyPlugin();

 });
</script>

answered Jul 18, 2019 at 7:05

Manprit Singh Sahota

1,3492 gold badges15 silver badges41 bronze badges

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

8 Comments

Rahul Chaudhari Over a year ago

Thanks @Manprit , I have just tried and getting same error. I have updated my question again.

Manprit Singh Sahota Over a year ago

The code works fine for me. May be clearing cache can help you.

Rahul Chaudhari Over a year ago

This is too odd. i have tried with new project and its not working for me. code and everything is ok but not getting where is the actual problem

Rahul Chaudhari Over a year ago

Yes . I got error message

jquery-3.3.1.min.js:2 Uncaught TypeError: $(...).MyPlugin is not a function      at HTMLDocument.<anonymous> (Example:57)      at l (jquery-3.3.1.min.js:2)     at c (jquery-3.3.1.min.js:2)

Rahul Chaudhari Over a year ago

Yes..!!!! Solved. The main reason was my Layout page. The Jquery bundle was execute after my JS Plugin so i faced this problem.

|

Collectives™ on Stack Overflow

How to call Jquery Plugin function from outside of plugin

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related