How to place this java script function in an external file for user control?

Question

I have a user control called header.aspx. In my user control if I do this it will work.

<script type="text/javascript">
    function greeting(){
        Alert("hi");
    }
</script>

 <asp:button id="button1" OnClientClick="greeting" /> </asp:button>

I am using this user control in a page called default.aspx. I tried using src="~scripts/foo.js". If I do that it does not work. The question is pretty simple I guess. How would I call a java script function in a user control which is stored in an external location( not in the page. Located in the scripts folder). Thanks in advance.

Issue may be in the path src="~scripts/foo.js" you are specifying. — Hassan Nisar
– Hassan Nisar, Commented Jun 19, 2014 at 4:29

Ali · Accepted Answer · 2014-06-19 04:46:24Z

2

As I can understand this is clearly a path issue. Just follow these steps might help you.

Create a .js file first. Put your code and save it in the folder you want it to.

Now Drag and Drop the js file inside the head section of your html code from the Solution Explorer window. This will give you the correct path for the js file.

The above steps is what I follow, when I create an external js file for my controls.

Also make sure you call your function in this manner also suggested by others Else your function won't get call:

<asp:button id="button1" OnClientClick="greeting();" /> </asp:button>

edited Jun 19, 2014 at 4:46

Ali

2,5922 gold badges18 silver badges24 bronze badges

answered Jun 19, 2014 at 4:32

Krunal Patil

3,6745 gold badges24 silver badges28 bronze badges

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

6 Comments

trant trum Over a year ago

Thanks for the reply. Just to double check. This procedure would work for a user control too right?

Krunal Patil Over a year ago

yes it will. I use this my my list box controls too.

Hassan Nisar Over a year ago

upvoted. It is better approach to use external js file.

Krunal Patil Over a year ago

@tranttrum, if this answer was helpful, please accept it as an answer, so that it can be helpful to others in future.

शेखर Over a year ago

@HassanNisar but you are increasing a http request is not it?

|

Ali · Accepted Answer · 2014-06-19 04:36:18Z

2

Just use the code below:

<script src="<%: ResolveUrl("~/Scripts/foo.js") %>"></script>

answered Jun 19, 2014 at 4:36

Ali

2,5922 gold badges18 silver badges24 bronze badges

Comments

Mohit · Accepted Answer · 2014-06-19 04:36:55Z

2

Script: test.js

    function greeting() {
    alert("hi");
    return false;
}

user control: <asp:Button ID="button1" OnClientClick="return greeting()" runat="server" Text="click" />

Page:

    <head runat="server">
    <title></title>
    <script src="test.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:temp ID="temp" runat="server" />
    </div>
    </form>
</body>
</html>

This should work now.

answered Jun 19, 2014 at 4:36

Mohit

811 bronze badge

3 Comments

trant trum Over a year ago

Thanks for the reply. Why should we use return greeting() not just greeting?

Krunal Patil Over a year ago

@trant trum, there is no need for return in your code, as its only alert you need, but in case if your javascript function is returning some values than you need to use return.

Mohit Over a year ago

No need to write return if you are not returning the value. In my code i have returned false from the function, so i have used return greeting().

bumbumpaw · Accepted Answer · 2014-06-19 05:02:33Z

1

 <asp:button id="button1" OnClick=" javascript : greeting();" /> </asp:button>

try to use it. havent trie but i think it should work.

answered Jun 19, 2014 at 5:02

bumbumpaw

2,5261 gold badge29 silver badges57 bronze badges

Comments

Raja Danish · Accepted Answer · 2014-06-19 04:48:48Z

0

First of all you need to create a seprate javascript file and then add this in your page in this way. add this tag in the tag of your page.

use

OnClientClick="greeting()"

you missed "()" in OnClientClick="greeting"

Please see the whole html code:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="scripts/foo.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:button id="button1" runat="server" OnClientClick="greeting()" Text="hit" />
    </div>
    </form>
</body>
</html>

Thanks.

edited Jun 19, 2014 at 4:48

answered Jun 19, 2014 at 4:25

Raja Danish

2351 silver badge7 bronze badges

4 Comments

trant trum Over a year ago

I tried that. But I get an exception saying the javascript function is not found.

Raja Danish Over a year ago

is javascript file is in "script" function? if it's so then use the updated line.

Hassan Nisar Over a year ago

@Raja. Script in the path is not function. It is folder.

Raja Danish Over a year ago

also use alert instead of Alert.

Shruti · Accepted Answer · 2014-06-20 15:34:14Z

0

External javascript file reference:

<script src="yourpath/yourfilename.js"></script>

Button Control

<asp:Button ID="button1" OnClientClick="greeting();" runat="server" Text="click" />

answered Jun 20, 2014 at 15:34

Shruti

13 bronze badges

Collectives™ on Stack Overflow

How to place this java script function in an external file for user control?

6 Answers 6

6 Comments

Comments

3 Comments

Comments

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

6 Comments

Comments

3 Comments

Comments

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related