SitePoint Sponsor

User Tag List

Results 1 to 14 of 14
  1. #1
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Capturing events remotely

    Im building a Java package to create form elements on the fly, xhtml compatable and as generic as possible so they can be used in any situation I need but then I was thinking about capturing events for each of these elements.

    Because I want these Java classes reusable and as streamlined as possible I, of course, do NOT want to include javascript events for the objects OR calls to any javascript in the actual tags. This is something Ive not done before in javascript and after searching the web for an hour have only found the old fashioned event handlers like this:

    <input type='text' name='s' id='s' onblur='someFunction_or_js_code'>

    The onblur is the code I DONT want in my java packages! So how exactly do you attach an event (in this case the onblur for the object s) in a wholely external fashion that allows removal of this code and of course compatible with as many browsers as possible ......I would also add Im NOT worried about NN4, any IE under 5.0, or any other browser that doesnt support the DOM ...... these are simple little things I want to do for visual purposes and as long as they degrade gracefully I dont honestly care if they dont work in these antiques as they will NOT effect the actual functionality of the forms themselves..

    Thanks in advance!

  2. #2
    SitePoint Wizard stereofrog's Avatar
    Join Date
    Apr 2004
    Location
    germany
    Posts
    4,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure what you mean, but you can always say something like:

    some_element.onblur = function() { ... }

    in (global) javascript code.

  3. #3
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You mean like with attachEvent() and addEventListener()?

  4. #4
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    some_element.onblur = function() { ... }
    That would overwrite any existing functions, and does not allow for removal of functions, although you can write a custom function using that method to handle those problems.

  5. #5
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry folks I might not have explained myself well enough ... (was only on my second cup of coffee when I wrote it)

    What Im saying is I want my Java packages to create form objects without any of the proprietary javascript event handling code. So my forms are created with everything BUT javascript events handled (except the onsubmit event in the form tag)

    So lets say I have a form with 4 textareas and I "highlight" them when a client forgets to fill them out (all done via code in the onsubmit called function) ..... but after they go back and fill in those fields and then leave the field I want to "unhighlight" the fields ...... again without any onblur code in the actual html <input type='text'> code ....... effectively seperating all javascript from the actual html..

    Just to explain quickly, what Im building here is a completely generic java form tag package that builds (and refills when needed) form elements for web applications AND does complete seperation of code using external styles, external js and outputting full xhtml compliant tags ..... all built on the fly in my web applications...... its "kind of" my own version of the JSP tag library.

  6. #6
    SitePoint Enthusiast
    Join Date
    Feb 2005
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm..

    You want to add events withoud adding the on???? tags ?

    Maybe this is what you're looking for
    document.getElementsByTagName('input').addEventListener('focus', func, false);

  7. #7
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Appletalk
    Hmm..

    You want to add events withoud adding the on???? tags ?

    Maybe this is what you're looking for
    document.getElementsByTagName('input').addEventListener('focus', func, false);
    Yup thats what Im doing. I had looked at that over at quirksmode but it looks like browser support for it aint all that yet ..... Ill tell you what though I can WAIT till it works! Talk about a Java based mindset! That event listener code is ripped right from the pages of Java and I know it WELL! (although its called AddActionListener on the Java side)

  8. #8
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK I did this in my js file:

    Code:
    document.getElementById('dlr_contact_name').onblur = checkBgColor('dlr_contact_name');

    and have a function set up for it:

    Code:
    function checkBgColor(myId)	 {
      document.getElementById(myId).style.backgroundColor = '#FFFFFF';
      }
    but Im getting an "element has no properties" js error AND seeing as how I mangled up the other post I did today (loading js before html elements) that came to my mind BUT!

    Correct me if Im wrong here ..... isnt js the LAST thing loaded by the browser? If its NOT then I know my problem but what Im seeing with my tests (via alerts) is the onblur firing right in the middle of the page loading? Im nowhere near it with the mouse...... now Im a tad MORE confused!

    How does in the heck does onblur fire during page load?

  9. #9
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What Im saying is I want my Java packages to create form objects without any of the proprietary javascript event handling code. So my forms are created with everything BUT javascript events handled (except the onsubmit event in the form tag)...again without any onblur code in the actual html <input type='text'> code ....... effectively seperating all javascript from the actual html..
    ...and? stereofrog already posted the common, crossbrowser method for handling js events that separates the html and js, and which should be used as a matter of course for handling all events in js--all of which is thoroughly explained at quirksmode.com. Beginners generally 'inline' their event handlers, but they don't know any better and they usually get tripped up by the 'return' part at various times anyway.

  10. #10
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by 7stud
    ...and? stereofrog already posted the common, crossbrowser method for handling js events.
    Is my last post (with code based on stereofrog's) not showing to anyone besides me or something?

    The one that said this:

    but Im getting an "element has no properties" js error AND seeing as how I mangled up the other post I did today (loading js before html elements) that came to my mind BUT!

    Correct me if Im wrong here ..... isnt js the LAST thing loaded by the browser? If its NOT then I know my problem but what Im seeing with my tests (via alerts) is the onblur firing right in the middle of the page loading? Im nowhere near it with the mouse...... now Im a tad MORE confused!

    How does in the heck does onblur fire during page load?

  11. #11
    SitePoint Enthusiast
    Join Date
    Feb 2005
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can't pass an argument, you have to pass the reference to the function (xx.onblur = function.

    To catch which element fired the event, either call window.event or receive the event object as attribute.

    So, your function may look like this:

    function checkBgColor(e) {
    if(!e && window.event) e = window.event;
    e = (e.srcElement) ? e.srcElement : e.target;
    e.style.backgroundColor = '#FFFFFF';
    }

  12. #12
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Correct me if Im wrong here ..... isnt js the LAST thing loaded by the browser?
    All the computer languages I know execute lines of code sequentially. As for js, try this:
    Code:
    <html>
    <head><title></title>
    <script type="text/javascript" language="javascript">
    <!-- Hide from browsers without javascript
    
    alert("Is there any text on the page yet?");
    
    //alert(document.getElementById("d").firstChild.nodeValue);  //error: html elements don't exist yet
    
    window.onload=function ()
    {
    	alert(document.getElementById("d").firstChild.nodeValue);	
    };
    
    // End hiding -->
    </script>
    </head>
    <body>
    
    <div id="d">some text</div>
    
    <script>
    alert("What about now?");
    </script>
    
    </body>
    </html>

  13. #13
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    100% agreed BUT when a script is attached remotely (via the <script src=''> tag) I swore I read someplace that the browsers rendered the page first and then the js from the linked file ...... may sound silly but I swore I read that someplace years ago..

    Anyways Im going to take another stab at it tomorrow .... Ive got some Java to finish up tonight and this is really "icing on the cake" type stuff..

    Appletalk ..... Im kind of seeing what you mean there and will look at it in the a.m. I was trying to build one function to handle all of the possible "highlighted fields" (possibly 12) in one quick and easy function..... Ive got the highlighting part done (my other idiot post today) but was THINKING about have the fields "unhighlight" after they fix the mistakes..

    thanks all!

  14. #14
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    100% agreed BUT when a script is attached remotely (via the <script src=''> tag) I swore I read someplace that the browsers rendered the page first and then the js from the linked file ...... may sound silly but I swore I read that someplace years ago.
    It happens to everyone. The file listed in the src attribute behaves as if it was included between the <script> and </script> tags.

    (Note: I reworked the code I posted to show some more examples.)


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
  •