Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question button.value = variable doesn't work in Firefox

    The statement
    button.value = variable
    works fine in IE 6 but not in Firefox 3. Any suggestions for a fix?


    Relevant code fragments:

    The HTML document (written by php code) contains the hidden button
    <input name="dateToChange" type="hidden" id="dateToChange" value="IntialValue">

    elsewhere in the document there is a different button calling Javascript

    <input name="button2" type="button" onClick="drawDiv('end_date')" value="Calendar">

    The Javascript function is:
    function drawDiv(formField)
    {
    var dateToChange = document.getElementById('dateToChange')
    dateToChange.value = formField
    }

    Firefox will not change the value for sure and apparently won't even execute the last line.

    Debugging alerts before the last line return 'object' for dateToChange and
    'InitialValue' for dateToChange.value in both browsers.

    Alerts after the last line return 'object' and 'end_date' for dateToChange.value from IE6 and the value of the button is changed

    The same alerts never show in Firefox.


  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,920
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Try this:-

    Code:
    function drawDiv(formField) {
    document.getElementById("dateToChange").childNodes[0].nodeValue=formField;
    }
    Quizmaster: In nature, what invertebrate has a name which literally means "one hundred feet"?
    Contestant: Giraffe

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Quote Originally Posted by Philip M View Post
    Try this:-

    Code:
    function drawDiv(formField) {
    document.getElementById("dateToChange").childNodes[0].nodeValue=formField;
    }
    Are you OK, Philip? How can you consider a nodeValue of a childNode of a text field? Does a text field (or any other form control) bear child nodes?

    No. The problem could be that heritage gave a variable the same value as the id of an element (which have a neme also with the same value), which will confuse browsers. Change the variable, for instance:

    Code:
    function drawDiv(formField)
    {
    var dTC = document.getElementById('dateToChange');
    dTC.value = formField
    }
    As a general rule: don't name variables, arguments, functions same as the id or name attributes of the document's elements.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,920
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by Kor View Post
    Are you OK, Philip? How can you consider a nodeValue of a childNode of a text field? Does a text field (or any other form control) bear child nodes?
    Sorry Kor, I must be still bemused after my strenuous holiday.
    You won't believe it but my first thought was your solution (change the variable name) but then I thought that it was only IE which objected to the duplication, not Firefox, so if it worked in IE then that could not be the culprit. Aarrggghhh!
    Last edited by Philip M; 10-14-2008 at 01:09 PM.

  • #5
    Regular Coder
    Join Date
    Mar 2006
    Posts
    727
    Thanks
    35
    Thanked 132 Times in 123 Posts
    <input name="button2" type="button" onClick="drawDiv('end_date')" value="Calendar">
    document.getElementById will not return a value in firefox unless the element has an id that matches the argument-
    IE6 will return an element that has either the id or the name.

  • #6
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Quote Originally Posted by mrhoo View Post
    document.getElementById will not return a value in firefox unless the element has an id that matches the argument-
    IE6 will return an element that has either the id or the name.
    That element has an id.

    There might be another problem. Is there a FORM element to nest the elements?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #7
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks to all. I am still amazed at how many nice people there are "out there".
    I agree that the choice of variable name is dangerous so I changed that.
    Unfortunately, none of the suggestions work. Changing the original code fragment:
    dTC.value = formField
    TO
    alert(dTC)
    alert(dTC.value)
    dTC.value = formField
    alert(dTC)
    alert(dTC.value)

    IE produces 'object' 'InitialValue' 'object' 'end_date' {if formField is end_date}
    Firefox produces 'object HTMLInputelement' 'InitialValue' and then dies

    I have tried many changes, some crazy, some silly like " verus ' which can be a hangup in php. Still stuck. Somehow Firefox thinks changing dTC.value is an error.

    PS for last comment:
    There are forms in the original HTML but the hidden input is not imbedded in a form.

    Again; thanks for your time. Amazing

  • #8
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    ok. Post the whole HTML document (including the javascript codes) or show us a link to a test page. We need to be able to see/reproduce your error.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #9
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Wow. Thanks. Much more than I expected.

    Complete javascript is:
    http://www.meiere.com/_PHP/_recreateCCU_2/calendar.js

    The php code as text is:
    http://www.meiere.com/_PHP/_recreateCCU_2/params.txt

    Run that php code (to reproduce 'problem') as:
    http://www.meiere.com/_PHP/_recreate...rams.php?sites[]=1

    (None of the require_once or login calls are relevant.)

    Click on either button named "Calendar" to run the javascript.

    Probably not relevant:
    'View Data' will start at the beginning.
    Get to this page by checking Highway 9

    {I tried the links to calendar.js and params.txt in IE and Firefox. With IE, I had to save calendar.js first. Hope they give you what you asked.}

  • #10
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Ok, solved. As I suspected, the problem was somewhere else:

    Code:
    x.style.top = window.event.y
    x.style.left = window.event.x
    This is an IE model of capturing and handling events. Those lines suppose to find where the user gives a click (absolute x,y position) and to place the calendar there. Well, Mozilla has other event model, thus it considers those lines as errors and stops the code run there. All you have to do is to use a small workaround. Insert in the HTML document the event argument (Moz needs that) when calling the function (see the blue):
    Code:
    ...
    <input name="button" type="button" onClick="drawDiv(event,'begin_date')" value="Calendar">
    ...
    <input name="button2" type="button" onClick="drawDiv(event,'end_date')" value="Calendar">
    And modify the drawDiv() function like this:
    Code:
    function drawDiv(e,formField)
    {
    	var x = document.getElementById('mydiv')
    	var dTC = document.getElementById("dateToChange")
    
    	x.style.display = 'block'
    !e?e=window.event:null; //IE:Moz
    x.style.top = e.pageY?e.pageY+'px':e.y+'px'; // Moz:IE
    x.style.left = e.pageX?e.pageX+'px':e.x+'px'; //Moz:IE
    	dTC.value = formField
    }
    Last edited by Kor; 10-14-2008 at 07:26 PM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #11
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Perfect. I wish I could say Thank You in some more dramatic way.

    I have always known that there are people out there smarter than I am.
    It is not always that they are so nice.

  • #12
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Your problem started the moment you have chosen a medieval calendar code. I bet it is written about 10 years ago, or so. Nor the way of general coding is more up to date. For instance:
    Code:
    <script language="JavaScript1.2" src="../calendar.js"></script>
    language is deprecated. Now the browsers interpreters need type to know which kind of script have to handle. The luck is that javascript is the default scripting language, but it is safer and professional to specify the type
    Code:
    <script type="text/javascript" src="../calendar.js"></script>
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #13
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks again. You are exactly correct -- this is old code from about 3 people back.
    I fell into the trap of rushing. Hopefully I can avoid that in the future but you know how that goes.

    Bet you are a great parent -- very patient.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •