Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Checkbox: programmatically checking it, triggering the 'onchange' handler

Reply
Thread Tools

Checkbox: programmatically checking it, triggering the 'onchange' handler

 
 
aundro
Guest
Posts: n/a
 
      11-03-2005

Hello,

I've been looking on the web for a solution to this problem:
I create a set of checkboxes, and 2 buttons:
- one is labeled "All"
- the other is labeled "None"

Clicking "All" is supposed to check all the checkboxes, which it does
(that's not rocket science , but the 'onchange' event does not get
triggered.

I couldn't find an answer to this issue in the archives of
c.l.j. (even though I bet there is), so any idea/pointer is absolutely
welcome.

Am I doing something inappropriate here?

Thank you for any info!

Best regards,

Arnaud

 
Reply With Quote
 
 
 
 
Morgan
Guest
Posts: n/a
 
      11-03-2005
Observe the rule of KIS,



<form>

<input type="checkbox" name="checkIt" />
<input type="checkbox" name="checkIt" />
<input type="checkbox" name="checkIt" />

<input type="button" value="Tick All Boxs" onclick="runCheckAll()" />

</form>

<script type="text/javascript">
<!--
function runCheckAll()
{

var changeCheck = document.getElementsByName('checkIt');
for(i=0; i<changeCheck.length; i++)
{
changeCheck[i].checked = true;
}

}
//-->
</script>

 
Reply With Quote
 
 
 
 
Morgan
Guest
Posts: n/a
 
      11-03-2005
Ah wait, I didn't read your post properly, sorry.

I think you can set a handler to fire from a script without user
changing anything. Waitasec...

 
Reply With Quote
 
VK
Guest
Posts: n/a
 
      11-03-2005
aundro wrote:
> Hello,
>
> I've been looking on the web for a solution to this problem:
> I create a set of checkboxes, and 2 buttons:
> - one is labeled "All"
> - the other is labeled "None"
>
> Clicking "All" is supposed to check all the checkboxes, which it does
> (that's not rocket science , but the 'onchange' event does not get
> triggered.


Maybe because it doesn't have to?
<checkbox> has one top level user input event: "onclick" (besides all
these onkeypress, onbeforeprint etc.)

IE has new event called "onpropertychange" which will be called if you
change the checkbox state:

<input type="checkbox" name="cb02" onpropertychange="myFunction(this)">

FF has some very obscure interface for programmatically generated
events discussed in my post here:

Posted by: VK
<http://groups.google.com/group/comp.lang.javascript/browse_frm/thread/2602a35ef4a14ac1/50a2ac2da48b4df3>

But in this particular case an "artificial click" seems has no effect
(did not check this option through).


> Am I doing something inappropriate here?


You can do whatever you want in any way you want
I am just not clear why you need this two-tier scheme: 1) select 2)
trig onselect event to do something other ?
Why not just do it in one step:

checkboxes[i].checked = true;
someOtherActionWith(checkboxes[i]);

?

 
Reply With Quote
 
aundro
Guest
Posts: n/a
 
      11-04-2005
"VK" <(E-Mail Removed)> writes:

> Why not just do it in one step:
>
> checkboxes[i].checked = true;
> someOtherActionWith(checkboxes[i]);


Well, that's the way I'm proceeding right now, while I was waiting for
a possible better solution but, as nobody seems to be really inspired,
I guess there are none.

Also this post was, I admit, a bit oriented towards a more general
"Can someone tell/teach me about 'simulated' events?"
(I honestly though programmatically checking a checkbox would trigger
it's onchange handler)

Still: Thank you very much for the info!

Arnaud

 
Reply With Quote
 
VK
Guest
Posts: n/a
 
      11-04-2005
> "VK" <(E-Mail Removed)> writes:
>
> > Why not just do it in one step:
> >
> > checkboxes[i].checked = true;
> > someOtherActionWith(checkboxes[i]);


aundro wrote:
> Well, that's the way I'm proceeding right now, while I was waiting for
> a possible better solution but, as nobody seems to be really inspired,
> I guess there are none.
>
> Also this post was, I admit, a bit oriented towards a more general
> "Can someone tell/teach me about 'simulated' events?"
> (I honestly though programmatically checking a checkbox would trigger
> it's onchange handler)


As I said your question as posted was "How to trig an event from an
element if such element is not native EventProducer of the event in
question?".

Checkbox is not EventProducer of the "onchange" event (<select> is).
Theoretically you can create any artificial event using
document.createEvent (Gesko) and document.cretateEventObject (IE)
methods. But trying to dispatch artificial event to an element in
violation of its EventProducer model *seems* to lead to the security
exeption and script abort in FireFox.
As the question indeed doesn't seem very inspiring (it's rather QA
testing than an actual task) I don't feel like exploring it to the full
depth. Nevertheless the posted link shows all necessary technique to
program artificial events and to dispatch / fire them onto different
object. If you take your time to explore it - it would be interesting
to know the test results.

 
Reply With Quote
 
RobG
Guest
Posts: n/a
 
      11-04-2005
VK wrote:
>>"VK" <(E-Mail Removed)> writes:
>>
>>
>>>Why not just do it in one step:
>>>
>>>checkboxes[i].checked = true;
>>>someOtherActionWith(checkboxes[i]);

>
>
> aundro wrote:
>
>>Well, that's the way I'm proceeding right now, while I was waiting for
>>a possible better solution but, as nobody seems to be really inspired,
>>I guess there are none.
>>
>>Also this post was, I admit, a bit oriented towards a more general
>>"Can someone tell/teach me about 'simulated' events?"
>>(I honestly though programmatically checking a checkbox would trigger
>>it's onchange handler)

>
>
> As I said your question as posted was "How to trig an event from an
> element if such element is not native EventProducer of the event in
> question?".
>
> Checkbox is not EventProducer of the "onchange" event (<select> is).


Checkboxes *do* have an onchange event, it's in the HTML 4 specification.

<URL:http://www.w3.org/TR/html4/interact/forms.html#edef-INPUT>

Implementations vary - IE doesn't fire the event until the checkbox
loses focus (as per the spec but unintuitive), Firefox /et al/ fire the
event when the checkbox is checked (essentially making it an onclick
event) which is not what the spec says to do but is more intuitive.

[...]


--
Rob
 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      11-04-2005
RobG wrote:

> VK wrote:
>> As I said your question as posted was "How to trig an event from an
>> element if such element is not native EventProducer of the event in
>> question?".
>>
>> Checkbox is not EventProducer of the "onchange" event (<select> is).

>
> Checkboxes *do* have an onchange event,


There is no `onchange' event. There is a `change' event, and an
intrinsic `onchange' event handler.

> it's in the HTML 4 specification.
>
> <URL:http://www.w3.org/TR/html4/interact/forms.html#edef-INPUT>


The relevant specifications here are W3C DOM Level 2+ Events:

<http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-htmlevents>
<http://www.w3.org/TR/DOM-Level-3-Events/events.html#Events-eventgroupings-htmlevents>


PointedEars
 
Reply With Quote
 
RobG
Guest
Posts: n/a
 
      11-04-2005
Thomas 'PointedEars' Lahn wrote:
> RobG wrote:
>
>
>>VK wrote:
>>
>>>As I said your question as posted was "How to trig an event from an
>>>element if such element is not native EventProducer of the event in
>>>question?".
>>>
>>>Checkbox is not EventProducer of the "onchange" event (<select> is).

>>
>>Checkboxes *do* have an onchange event,

>
>
> There is no `onchange' event. There is a `change' event, and an
> intrinsic `onchange' event handler.
>


OK, I was not spot-on with my terminology.

The link I quoted is to the definition for input elements, of which
'checkbox' is a type. It shows that they have an onchange attribute,
the content of which is 'script'.

I really didn't know what to make of 'EventProducer of the "onchange"
event'.

>
>>it's in the HTML 4 specification.
>>
>> <URL:http://www.w3.org/TR/html4/interact/forms.html#edef-INPUT>

>
>
> The relevant specifications here are W3C DOM Level 2+ Events:
>
> <http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-htmlevents>
> <http://www.w3.org/TR/DOM-Level-3-Events/events.html#Events-eventgroupings-htmlevents>


You can go to the event spec and see what elements they apply to, or
look at the elements to see what attributes they have to find out what
events they support. Six of one, half a dozen of the other to me, but
thanks for the extras.


--
Rob
 
Reply With Quote
 
VK
Guest
Posts: n/a
 
      11-04-2005
My bad!

Microsoft indeed has "onchange" handled supported for <checkbox>
elements despite it's not documented and not listed on MSDN:
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/input_checkbox.asp>


But programmed state switch seems doesn't trig the event neither in IE
nor in FF. An attempt to sent such event "manually" leads to access
violation error in FF.

If we follow the old Netscape Gold scheme (the only one really we
should follow in forms the OP problem can be solved very easy by:
....
<input type="checkbox" name="check001" value="checkbox"
onclick="someAction(this)">
....

and:
....
myCheckboxes[i].click();
....

If it has to be the 'change' event and nothing else, then the solution
(if it exists) is not known to me.

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
How can I programmatically set the handler for a random event andhandler acw ASP .Net 0 02-15-2009 10:03 PM
How to define Http handler programmatically Pab ASP .Net Web Controls 0 08-12-2008 11:28 AM
Setting Output Cacheability Programmatically is Not Working - In Custom Handler Jordan S. ASP .Net 0 05-23-2008 02:34 AM
Adding ajax/som event handler programmatically news.rz.uni-karlsruhe.de ASP .Net 3 01-27-2008 01:11 PM
Dynamically-added Button not triggering event handler. Why? parsifal ASP .Net 4 03-15-2007 04:57 PM



Advertisments