Solved

javascript does not run properly when called from ASP:Button object

Posted on 2014-10-17
7
232 Views
Last Modified: 2014-10-19
I am calling a javascript object from an ASP button using OnClientClick.  the javascript gets called (added an alert to test) but does not run...  the funny thing is if a create an html input button, the script runs as expected.  
here are the buttons...
<asp:Button runat ="server" ID="btnLookupCustomer" Visible="true" Text="Lookup Customer" Enabled="false" OnClientClick="openPopUp();" />
<input type="button" id="test" value="Lookup Customer1" onclick="openPopUp();" />

Open in new window

and the javascript...
 function openPopUp() {
        alert("i'm here");
       TINY.box.show({ iframe: "CustomerSelectPopup.aspx", close: true, width: 700, height: 600 });
     }

Open in new window


I don't understand why it would work with one control and not the other.
0
Comment
Question by:Jfb1126
7 Comments
 

Author Comment

by:Jfb1126
ID: 40387935
also tried adding  UseSubmitBehavior="false" to the asp control with no avail...
0
 
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 40387960
I'm not a .NET dev but your asp code runs on the server before the page loads.  Your javascript runs on the client, after the page loads.

The best thing to do is to have the experts look at your rendered page.  Get your page on a public link.  If you are working locally, then just get the sample page somewhere public where it can be seen.  You can also render the html and place the html, css and javascript on jsbin.com or other playground.

More than likely you have a javascript error that is preventing this from working or the supporting files for the pop up are not loaded correctly, or you don't have your js code in a ready function.  It is hard to tell without seeing the full page.

http://sandbox.scriptiny.com/tinybox/
0
 
LVL 55

Accepted Solution

by:
Julian Hansen earned 500 total points
ID: 40388015
Try doing this  (add return before all to openPopUp).
<asp:Button runat ="server" ID="btnLookupCustomer" Visible="true" Text="Lookup Customer" Enabled="false" OnClientClick="return openPopUp();" />

Open in new window

Javascript
 function openPopUp() {
   alert("i'm here");
   TINY.box.show({ iframe: "CustomerSelectPopup.aspx", close: true, width: 700, height: 600 });
   // ADD THIS TO PREVENT DEFAULT CLICK BEHAVIOUR
   return false;
}

Open in new window

0
Space-Age Communications Transitions to DevOps

ViaSat, a global provider of satellite and wireless communications, securely connects businesses, governments, and organizations to the Internet. Learn how ViaSat’s Network Solutions Engineer, drove the transition from a traditional network support to a DevOps-centric model.

 
LVL 11

Expert Comment

by:louisfr
ID: 40389015
As julianH wrote, return false from the code to prevent the button from submitting the form.
UseSubmitBehavior is not used to prevent a postback, only to change how the postback is done.
0
 

Author Closing Comment

by:Jfb1126
ID: 40389479
adding the return to the call worked.  

thank you,
0
 
LVL 55

Expert Comment

by:Julian Hansen
ID: 40389758
You are welcome - thanks for the points - good luck with your project.
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

808 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question