[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 308
  • Last Modified:

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

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
Donnie Walker
Asked:
Donnie Walker
  • 3
  • 2
1 Solution
 
jet-blackCommented:
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
 
Donnie WalkerAuthor Commented:
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
 
jet-blackCommented:
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
 
Donnie WalkerAuthor Commented:
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
 
jet-blackCommented:
Thanks for accepting as a solution.
Hope you will find the source of the compiler error too.
Good luck.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now