Try this...
$("#bChecklist input:checkbox").click(function(event){
var item = $(this).parent().text();
alert ( (this.checked ? '' : 'Un') + 'Checked = ' + item);
});
On May 8, 1:38 am, mr4d <[EMAIL PROTECTED]> wrote:
> Hi all,
>
> Can't quite get the the following functionality to work:
>
> 1. when I click on an un-checked checkbox, I want the box to be
> checked AND to raise an alert showing the text of the item which has
> just been checked.
>
> 2. Similarly if the user unchecks the box I want to raise an
> "unchecked" alert and then have the box unchecked.
>
> I have been trying to do this for about an hour but the behavior is:
>
> a. I am getting the "Checked" alert for clicks on both checked
> and unchecked checkboxes
> b. Once the user checks a box I get the "Checked" alert but the
> box never actually gets checked.
>
> The code is:
>
> $("#bChecklist > li").click(function(event){
> var item = $(this).text();
> // get the label value
>
> if ($(this).not(':checked')){
> event.preventDefault();
> alert ('Checking = '+ item)
> this.checked = true; // my attempt to
> force an unchecked box to be true
> // after
> using event.preventDefault
> }
> else if ($(this).is(':checked')) {
> event.preventDefault();
> alert ('UnChecking = '+item)
> }
> });
>
> <form id="myForm" name="myForm" action="/cm/BaB/create/"
> method="post">
>
> .....
>
> <div class="row" id="div2">
>
> <fieldset id="bundleFields"> <!-- Add dynamically -->
> <legend id="bundleLegend" >Bundle Task</legend>
> <ul class="bChecklist" id="bChecklist">
>
> <li><label for="o1"><input id="o1" name="o1" type="checkbox"
> class=bundleItem />MYTHINGY 1</label></li>
>
> <li><label for="o2"><input id="o2" name="o2" type="checkbox"
> class=bundleItem />MYTHINGY 2</label></li>
>
> <li><label for="o3"><input id="o3" name="o3" type="checkbox"
> class=bundleItem />MYTHINGY 3</label></li>
>
> </ul>
> </fieldset>
> </div><br clear="all"/>
> </form>
>
> Not quite sure what I am doing wrong. .
