[Javascript] Targeting the correct form??

Terry Riegel riegel at clearimageonline.com
Wed Feb 25 13:07:23 CST 2009


David,

Thanks for your reply. I think I have been caught with this several  
times over the years and for some reason can't get my head around it.  
I know I have asked questions like this on this exact same issue in  
the past and this group (possibly you) have been very kind to answer.

I do have one followup question...

I tried both of your methods but only one worked. Any idea what was  
wrong with the second I listed here...

Perhaps is something obvious I am missing.



This one worked
----------------
function forms(h) {
  var daItems = $$('.'+h);
  for (iItem=0; iItem < daItems.length; iItem++) {
   var o=daItems[iItem]
   o.onsubmit=doforms;
  }
}

  var doforms = function() {
  alert(this.id);
  return false;
  }


This one did not work
---------------------
function forms(h) {
  var daItems = $$('.'+h);
  for (iItem=0; iItem < daItems.length; iItem++) {
   var o=daItems[iItem]
   o.onsubmit=function(){return doforms(this)};
  }
}

function doforms() {
  alert(this);
  return false;
  }



Thanks again,

Terry




On Feb 25, 2009, at 12:07 PM, David Dorward wrote:

> Terry Riegel wrote:
>> Hello everyone. I am struggling with a particular function. I have a
>> page with multiple forms on it. I am applying unobtrusive javascript
>> to it and am having difficulty targeting the right form with my code.
>> Via an onload I call forms() and that works great. When I go to  
>> submit
>> the form I simply alert the id of the form submitted. At least thats
>> what I would think my code would do (listed below). Instead  
>> regardless
>> of what form button I click on It alerts the id of the last form
>> element on the page.
>>
> This is a common error.
>
>> Any help will be greatly appreciated.
>>
>>
>> function forms(h) {
>>  var daItems = $$('.'+h);
>>  for (iItem=0; iItem < daItems.length; iItem++) {
>>    var o=daItems[iItem]
>>    o.onsubmit=function(){return doforms(o)};
>>   }
>>  }
>>
>>  function doforms(o) {
>>  alert(o.id);
>>  return false;
>>  }
>>
>
> When you assign function(){return doforms(o)};, "o" means "The  
> variable
> o" not "The current value of the variable o".
>
> Since the loop keeps going - o ends up being the last value that it
> reaches by the time the function is ever called.
>
> I could explain how to use closures to work around this, but its much
> simpler to just suggest you use this instead.
>
> o.onsubmit=function(){return doforms(this)};
>
>
> Or even easier:
> var doforms = function () {
>  alert(this.id);
>  return false;
> };
>
> and
> o.onsubmit=doforms;
>
>
> And just for good measure, insert rant about obfuscated code:
> http://dorward.tumblr.com/post/79674407/the-dollar-function-must-die
>
> -- 
> David Dorward
> http://dorward.me.uk/
> _______________________________________________
> Javascript mailing list
> Javascript at lists.evolt.org
> http://lists.evolt.org/mailman/listinfo/javascript




More information about the Javascript mailing list