asked on

JS function in one page, but call it from another page

I'm using this JS and applying it to my app. This example work in both IE and FireFox when I do a "test" app. *** When I apply it to my actual code, it works in IE and doesnt in Firefox.

http://www.mattkruse.com/javascript/calendarpopup/combined_source.html

--I think this is because: I have a Admin/Order/default.aspx page. It has a content page. I put the link to JS in it. I have the textbox there as well. **In IE it's all fine.
In Firefox, i click on the calendar and nothing happens.

-- So, I want to move the 2 lines below from Admin/Orders/Default.aspx to my Admin/Default.aspx. This page has the form, the head tags. BUT call this function from my Orders/Default.aspx.

******* When I do that, I get an error that "cal" is null or undefined.

-- I have JS enabled in FireFox. I also turned off pop-up blockers.

<script type="text/javascript" language="JavaScript">
	var cal = new CalendarPopup();
	</script>  
	
	  <script language="javascript" src="../Scripts/CalendarPopup.js" type="text/javascript"></script>
  
-- I call it like this:
   <td><input  id="txtStartDate"   size="7" runat="server"  readonly="readOnly" type="text" />
                
                            <a href="#"    onclick="cal.select(ctl00_Navigation_txtStartDate,'anchor1','MM/dd/yyyy'); return false;"
                          name="anchor1" id="anchor1">select</a>
                </td>

Open in new window

ASKER CERTIFIED SOLUTION

jrram

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Camillia

ASKER

ok, I was getting an error that's solved by #1. BUT still, when I go to firefox, the calendar doesnt popup.

In IE, when there's a JS error, there's an error at the botton in IE. Firefox doesnt show JS errors?

#2 is correct. ASP.Net renders it to ctl00_Navigation_txtStartDate. I put another JS alert and looked at in Firefox and it's the same as IE.

How can I debug this in Firefox??

Camillia

ASKER

I put an alert("test") in that JS code. When I load the page, it pops up. Both in IE and in FireFox. So I know the JS is being loaded. It's when I click on "select" that the calendar needs to pop-up but it doesnt in Firefox....

Anything i need to turn on or off??

Camillia

ASKER

My test app works tho ...so I go back to my first question...can I put the JS code in another page but call it from another page?

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Calendar.aspx.cs" Inherits="_Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Calendar using javascript</title>
    <script language="javascript" src="Calendar.js" type="text/javascript"></script>
    
    <script language="javascript" src="CalendarPopup.js" type="text/javascript"></script>
  
    <SCRIPT type="text/javascript" LANGUAGE="JavaScript">
	var cal = new CalendarPopup("testdiv1");
	</SCRIPT>
  
    <link href="Calendar.css" rel="stylesheet" type="text/css"> 
</head>
<body>
    <form id="form1" runat="server">    
   <asp:Label ID="lblDateSent" runat="server" Text="Posted on:" CssClass="graytextbold"></asp:Label>
        <input ID="PostedOn" runat="server" class="NormalTextBox" readonly="readOnly" type="text" />&nbsp;
        <a onclick="showCalendarControl(PostedOn)" href="#">
        <img src="calendar.gif" style="width: 20px; height: 20px" border="0" /></a>
        
        <a href="#"    onclick="cal.select(document.forms['form1'].PostedOn,'anchor1','MM/dd/yyyy'); return false;"
                          name="anchor1" id="anchor1">select123</a>
   </form>
   
   <div id="testdiv1"  style="position:absolute;visibility:hidden;background-color:white; background-color:Lime;"></div>
</body>
</html>

Open in new window

SOLUTION

hielo

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Camillia

ASKER

Really? let me see what this Firebug is and where i can dowload it from.

hielo

>>where i can dowload it from
Open FF, click on Tools > Add Ons

Depending on your FF version, you might see a Get Extension Link on the lower-right of the pop up window OR you may be able to search immediately for "Firebug" from the pop up window.

Camillia

ASKER

thanks so much. Will try this tomorrow morning.

Camillia

ASKER

Upgraded to FF 3.0 and installed FireBug. I enabled JS debugging. I click on "select" to popup the caender. Then I clicked on the "bug" image on the bottom right hand corner.I see tabs like DOM,HTML, CSS. But nothing is displayed to be error.For example,in DOM..i see green text BUT i also see red text. Not sure if the red text is the errors or not..

In IE, I can turn on script debugging and then if I put the word "debugger" in the code, I can actually step thru the code. Let me see if FF has something like "enable script debugging".

Camillia

ASKER

Ok, getting close, I turned in the "console" in FireBug and now I see the error. I see 2 errors and one is related to that Javascript calendar. Let me see.

Camillia

ASKER

Fixed,thank you both.FireBug showed what jrram mentioned above about the name of the textbox.It worked in IE but then I changed it to document.getElementById('<%=txtStartDate.ClientID%>')
and now it works in both IE and FF.

I dont know why that method of getElementById sometimes doesnt work in my other pages.