Solved

Is there a way to make this popup calendar work with this form field value?

Posted on 2011-09-14
5
285 Views
Last Modified: 2012-05-12
I have this javascript where I MUST use the value "DATE.VAR1". Of course, this javascript does not like the period between DATE and VAR1. If I take it out, the calendar works as expected. I tried putting quotes and single quotes around the value and that didn't work.

Is there a way to make this work with DATE.VAR1?

<HTML>
<HEAD>
      <TITLE>JavaScript Toolbox - Calendar Popup To Select Date</TITLE>
      <SCRIPT LANGUAGE="JavaScript" SRC="CalendarPopup.js"></SCRIPT>
      <SCRIPT LANGUAGE="JavaScript">
      var cal = new CalendarPopup();
      </SCRIPT>
</HEAD>
<BODY>

<FORM NAME="example">
(View Source of this page to see the example code)<br>

<INPUT TYPE="text" NAME="DATE.VAR1" VALUE="" SIZE=25>
<A HREF="#"
   onClick="cal.select(document.forms['example'].DATE.VAR1,'anchor1','MM/dd/yyyy'); return false;"
   NAME="anchor1" ID="anchor1">select</A>
</FORM>

</BODY>
</HTML>
CalendarPopup.js
0
Comment
Question by:Donnie Walker
  • 3
  • 2
5 Comments
 
LVL 12

Accepted Solution

by:
jet-black earned 500 total points
ID: 36538897
Hi rentawebguy,
You can also access form by its id:

<HTML>
<HEAD>      <TITLE>JavaScript Toolbox - Calendar Popup To Select Date</TITLE>
      <SCRIPT LANGUAGE="JavaScript" SRC="CalendarPopup.js"></SCRIPT>
      <SCRIPT LANGUAGE="JavaScript">
      var cal = new CalendarPopup();
      </SCRIPT>
</HEAD>
<BODY>

<FORM NAME="example">
(View Source of this page to see the example code)<br>

<INPUT TYPE="text" NAME="DATE.VAR1" id='date_var1' VALUE="" SIZE=25>
<A HREF="#"
   onClick="cal.select(document.getElementById('date_var1'),'anchor1','MM/dd/yyyy'); return false;"
   NAME="anchor1" ID="anchor1">select</A>
</FORM>

</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:Donnie Walker
ID: 36539070
That works on the example form but when I add it to my form (which is generated by UNIBasic) I get an error on the getElementById line. Am I missing something?:


OUTPUT.DATA := '<DIV ID="div1" STYLE="position:absolute;visibility:hidden;background-color:white;layer-background-color:white;"></DIV>'
OUTPUT.DATA := '<SCRIPT LANGUAGE="JavaScript">'
OUTPUT.DATA := 'var cal1 = new CalendarPopup("div1"); cal1.showNavigationDropdowns();'
OUTPUT.DATA := '</SCRIPT>'
OUTPUT.DATA := '<A HREF="#" onClick="cal1.select(document.getElementById('DATE_VAR1'),'anchor1','MM/dd/yyyy');' 
OUTPUT.DATA := 'return false;"' 
OUTPUT.DATA := 'TITLE="PICK A DATE"'
OUTPUT.DATA := 'return false;"' 
OUTPUT.DATA := 'NAME="anchor1" ID="anchor1";"><img border="0" src="/docs/images/cal2.jpg" width="25" height="25" name="cal2" onmouseOver="mouseOver1()" onmouseOut="mouseOut1()" /></A>'

Open in new window

0
 
LVL 12

Expert Comment

by:jet-black
ID: 36539171
What is the error you are getting?

I don't think the problem would be related to the javascript anymore.

It may be related with the ' character.
Try to escaping them.
I don't know UniBasic but it may be like that:
OUTPUT.DATA := '<A HREF="#" onClick="cal1.select(document.getElementById(\'DATE_VAR1\'),\'anchor1\',\'MM/dd/yyyy\');'

You may also need escape / too.

Just check the final HTML output of your program and compare it to the working one.
0
 

Author Comment

by:Donnie Walker
ID: 36539251
I don't think the escape is the problem because if I change the field from "DATE.VAR1" to "VAR1" it works fine as previously written (without the getElementByID).

I tried your suggestion but I still get an error. I can't actually see the final code because it has to compile.

Since your solution works with the sample form I'm going to go ahead and accept this as the solution.
0
 
LVL 12

Expert Comment

by:jet-black
ID: 36539324
Thanks for accepting as a solution.
Hope you will find the source of the compiler error too.
Good luck.
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
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…

746 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

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now