Question

Currently, I have an event handler for $('.toggle-enable-item').click(functi .... which does an ajax request and a set of associated callbacks. I would like to just add one for $('.toggle-enable-menu-item .with-comment').click(fun... and set the textarea for that comment to a window.unenable_comment.

However, the event for .with-comment just proceeds through. Is there a way to tell Javascript to halt execution until the user clicks the button for ‘Add Comment Item’? Ideally, I’d like this to cascade into the ‘toggle-enable-item’. FWIW, the prompt call seems to halt execution correctly.

Is this happening because the event is being bubbled up? Is there a way I can prevent this bubbling and just make the ajax call separately?

non-enabled:

<li data-id="1709" data-status="not-enabled" class="toggle-enable-item">enable</li>

enabled:

<li class="toggle-enable-item" data-id="1710" data-status="enabled">
unenable
<span class="with-comment">with comment</span>
</li>

thx

Answer 1

You can prevent bubbling by using event.stopPropagation() in the $('.toggle-enable-menu-item .with-comment').click(function(event){ Then after the user clicks the button trigger a click on toggle-enable-item