[Javascript] advise on approach, pls

David T. Lovering dlovering at gazos.com
Tue Oct 7 09:12:22 CDT 2003


I haven't worked it out in detail, but mightn't it be possible to attach the attributes as a consequence
of an onload event to each object as it is defined?

-- Dave Lovering

Walter Torres wrote:
> 
> I have a need to extend the functionality of certain HTML Form Elements,
> namely TEXT & PASSWORD boxes and TEXTAREAs.
> 
> What I need I have working. I'm just trying to find a "better way".
> 
> If I explain what I'm doing, maybe you might be able to answer my real
> question, at the end of this.
> 
> Currently, I walk down the entire length of the FORM Object, looking for
> these types of Elements. If found, they are dropped into another array.
> 
> (Maybe it this part could be improved for this loop to call a method to do
> all the work, instead of dropping found items to another array and then do
> work on that array. mmm :/ )
> 
> Like this...
> 
>    // loop through all FORM Objects
>    for (var i = 0; i < form.length ; i++)
>    {
>       // We are looking for INPUT Objects with the TYPE
>       // of TEXT and PASSWORD.
>       // We are also looking for TEXTAREA Objects
>       if ( ( ( form.elements[i].nodeName == "INPUT" ) &&
>          ( form.elements[i].type == "text" ) ||
>          ( form.elements[i].type == "password" ) ) ||
>          ( form.elements[i].nodeName == "TEXTAREA" ) )
>          // if we find any of these, PUSH them into our Array
>          // We don't use PUSH because not all JS engines have it
>       {
>          aryTargetTags[y] = form.elements[i];
>          y++;
>       }
>    }
> 
> If I have anything, I then walk down that [!] array and look for certain
> attributes...
> 
>    // We only want to do this if the Object is set for it
>    if ( ( aryTargetTags[i].getAttribute('progress') ) &&
>         ( aryTargetTags[i].getAttribute('maxlength') > 0 ) )
>    {
> 
> If these attributes are found I insert a new Document Object to display a
> small status bar...
> (NOTE: The comments talk about TEXTAREAs, that is what I started with. But
> it all
>        works with either TEXTAREAS or TYPE=TEXT/PASSWORD as well.)
> 
>       // Create a new OBJECT
>       objBar = document.createElement("SPAN");
>       objBar.setAttribute("id",aryTargetTags[i].id + '_pad');
> 
>       // get the TEXTAREA and its parent
>       objTA = aryTargetTags[i];
>       objParent = objTA.parentNode;
> 
>       // insert it in the children of objectparent before the sibling of the
> TextArea
>       objParent.insertBefore(objBar,objTA.nextSibling);
>       // Create Bar Graph for TEXTAREA
>       objBar.innerHTML = buildStatusBar ( aryTargetTags[i].id , 250 );
> 
> Once that new Object is created, I add event handlers to the Form Element in
> question...
> 
>       // Insert new Method to Form Element
>       aryTargetTags[i].setBar = setBar;
> 
>       // Now attach Event Actions
>       aryTargetTags[i].onpaste    = setBar;
>       aryTargetTags[i].onkeypress = setBar;
>       aryTargetTags[i].onkeyup    = setBar;
> 
>       // Make the default value available
>       aryTargetTags[i].setBar();
>    }
> 
> OK, so now, if any TEXTAREAs, TEXT or PASSWORD elements found with the new
> attributes of 'progress' AND 'maxlength' (maxlength is an existing attribute
> to TEXT and PASSWORD, but not TEXTAREA) they have 3 element handlers added
> to them.
> 
> This works. It works fine.
> 
> (Actually, the status bar works in IE and Mozilla, but not Opera. But that
> is another issue I will tackle later)
> 
> What I was wondering, do you know of anyway of "registering" any Form
> Elements with some method that I can do the same thing?
> 
> Meaning, some way to telling my setDisplayLimit() method to attach itself to
> a particular Form Element (which is what I have done) in a more direct
> manner. Something other than looking at every single Form Element and asking
> if it needs this method (which is what I'm doing now)?
> 
> Any ideas?
> 
> Thanks
> 
> Walter
> 
> _______________________________________________
> Javascript mailing list
> Javascript at LaTech.edu
> https://lists.LaTech.edu/mailman/listinfo/javascript



More information about the Javascript mailing list