SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    ********* Ornithologist AtomicPenguin's Avatar
    Join Date
    May 2002
    Location
    Vancouver, BC
    Posts
    459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    passing reference to form from non-input field

    Hey guys!

    Just came across interesting js issue and wondered if someone had some advice.

    I have a bunch of forms in my page, and want to pass a reference to the current form to a javascript function - when, say, a user clicks on a particular element. Normally, within any type of input field, I'd just add something like this:

    onclick="my_function(this.form)"

    Then, in my_function( form ) I could refer to form. No worries.

    But here's the interesting bit. I also want to run the same function when the user clicks on any <a> tag within a form, like:

    <a href="javascript: my_function(this.form)"> ... </a>

    Problem is, with this code, the form reference isn't passed to the javascript function. the "this.form" bit doesn't work...

    I find this rather curious. So the question is, how do I pass a reference to the current form from within a non input field?

  2. #2
    SitePoint Member
    Join Date
    May 2004
    Location
    Cheshire, UK
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you tried specifying the form using its ordinal reference or name?

    I'm not at work so I can only guess (can't test) that its passing a reference to form[0] which is likely to be the default form.

    Is the function being called? If so is this.form == null ? If not iterate through the elements and work out which form reference was passed.

    Or something.

  3. #3
    ********* Ornithologist AtomicPenguin's Avatar
    Join Date
    May 2002
    Location
    Vancouver, BC
    Posts
    459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To be honest, I really didn't want to have to specify which form it belonged to (reason being, it's going to be a script that others can use - so I want it as dummy-proof as possible).

    And yeah, it's executing the function just fine - it just doesn't get passed the form name with non-input fields...

    Any other ideas? [Thanks, though!]

  4. #4
    SitePoint Evangelist
    Join Date
    Sep 2003
    Location
    San Diego, CA
    Posts
    591
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Like he said, if there is only one form on the page, document.forms[0] will call the first form on the page...

  5. #5
    SitePoint Enthusiast
    Join Date
    Apr 2002
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <a> tags are not form elements which is why function(this.form) won't work in an <a> tag. You will have to specify the form.

  6. #6
    SitePoint Addict
    Join Date
    Nov 2003
    Location
    Malmoe, Sweden
    Posts
    265
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would do like this:

    Have one function called from form elements (i.e. INPUTs, RADIOs) and another function called from anchor elements. In the function that is called from anchors you attach this. Now you have the anchor object and can traverse the node tree with a little help of DOM and JavaScript and get the form in which the clicked anchor resides.

    Something like (not tested, only theory)

    Code:
    function onAnchorClick(objAnchor)
    {
    	var objForm = objAnchor;
    	
    	while (objForm.tagName != 'FORM')
    	{
    		objForm = objForm.parentNode;
    	}
    	
    	alert(objForm.name);
    }
    
    <a href="" onclick="javascript:onAnchorClick(this); return false;">anchor</a>


Bookmarks

Posting Permissions

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