How do I use the aspx page to load a JavaScript function on a button click

I need to load a JavaScript function upon a button click.  I forgot how do I relate the asp control inside the aspx page with the JavaScript and the OnClick event.

Could someone please send me this?

thans,
newbieweb
newbiewebSr. Software EngineerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

jinn_hnnlCommented:
<asp:Button ID="btAdd" runat="server" Text="Add" />

code behind Page_load
btAdd.Attributes.Add["onclick", "myJavaScriptFunction()");

Is that what you want ?

JINN
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
jinn_hnnlCommented:
And maybe you wondered, this is how you register a javascript function which at server side you want to generate and render to your page

Hope this helps
JINN



public void Page_Load(Object sender, EventArgs e)
 {
    if(Request.QueryString["redirect"] != null)
      if(Request.QueryString["redirect"] == "true")
        if (!this.IsStartupScriptRegistered("Startup"))
        {
          // Form the script to be registered at client side.
          String scriptString = "<script language=\>";
          scriptString += "function MyFunction(){alert('hello world'}";     
          scriptString += "</script>";
          this.RegisterStartupScript("Startup", scriptString);
        }
 
       btAdd.Attributes.Add("onclick", "MyFunction()");   
 }

Open in new window

0
jinn_hnnlCommented:
ahh, forget about line 3 and 4 (i copied it from my other solution and forget to take it off)
JINN
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

newbiewebSr. Software EngineerAuthor Commented:
I was thinking more like this.  Except this does not work.  Is it the javaScript
of the ASP.NET that's at fault?

thanks,
newbieweb

<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript">
        function DODataLookup(){
            window.location = "../DataLookup.aspx";
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="submitBtn" runat="server" script="DODataLookup()" Style="z-index: 100;
            left: 118px; position: absolute; top: 140px" Text="Submit" />
   
    </div>
    </form>
</body>
0
jinn_hnnlCommented:
Oke then it should be:
 
<asp:Button ID="submitBtn" runat="server" OnClientClick="DODataLookup()" Style="z-index: 100; left: 118px; position: absolute; top: 140px" Text="Submit" />
   
Check this link
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.onclientclick.aspx

JINN

^^

0
jinn_hnnlCommented:
anyway you can set style like that for your button I guess, you will have to set the CssClass which refers to the predefine CSS class. If you want to simplify that:

<div style="z-index: 100; left: 118px; position: absolute; top: 140px">
     <asp:Button ID="submitBtn" runat="server" OnClientClick="DODataLookup()"  Text="Submit" />
</div>

or <span>

It is not possible to use normal html property for server control like you do with <input > <select ..> normal html element

JINN
0
newbiewebSr. Software EngineerAuthor Commented:
This is not working.  Could it be the path name in the JavaScript?

how do I find the error?

newbieweb


<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript">
        function DODataLookup(){
            window.location = "../DataLookup.aspx";
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div style="z-index: 100; left: 118px; position: absolute; top: 140px">
        <asp:Button ID="submitBtn" runat="server" OnClientClick="DODataLookup()"  Text="Submit" />
    </div>
    </form>
</body>
0
jinn_hnnlCommented:
you can test if your button call the javascript by:

      function DODataLookup(){
           alert(' hey ');
            window.location = "../DataLookup.aspx";
    }

you see hey, then the next line is the problem, appear to me it will navigate to the parent folder of this page and lookfor datalookup.aspx ? is what you want? What you are doing is redirecting the current page to that page.

Play around with the path

Jinn
0
Gyanendra SinghArchitectCommented:
I have test your code ... Its working in my end ... it seems that below line is not correct in your method

window.location = "../DataLookup.aspx";

please check the path  and correct it .. attached working code
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript">
        function DODataLookup(){
        alert ( "HI")
            window.location = "../DataLookup.aspx";
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div style="z-index: 100; left: 118px; position: absolute; top: 140px">
        <asp:Button ID="submitBtn" runat="server" OnClientClick="DODataLookup()"  Text="Submit" />
    </div>
    </form>
</body>
</html>

Open in new window

0
newbiewebSr. Software EngineerAuthor Commented:
I'm having trouble with a null test in JavaScript for a var type:

        alert('OK1');
        var elem = document.getElementByID("recordLocatorTextBox");
       
        if (elem != 'undefined')
        {
               alert('OK2');
        }

what is the correct way to test if elem is null?  I never get OK2.

newbieweb
0
sh0eCommented:
if(elem!=undefined)
0
jinn_hnnlCommented:
There are major different between undefined and null,

If you check
 if (elem != null)
        {
               alert('OK2');
        }
it's the same as
 if(!elem),
and they are good enough

btw if you want to check if the property is set or not:
 if (elem.style != 'undefined') is the correct way (with quote)

Keep in mind, javascript is case sensitive:
var elem = document.getElementById("recordLocatorTextBox");
(instead of ID it's Id)

JINN
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
C#

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.