0

I have a checkbox that I need to add some javascript to.

I am having issues getting this to work because I have a bootstrap modal that has Cancel and Confirm buttons.

I am unsure how to pass the un-check reference to the modal code and uncheck the checkbox on on the Confirm button. I have made many attempts but failed on all attempts.

How do I do un-ceck the checkbox only when the user selects the Confirm button on the bootstrap modal. When the user selects the modal Cancel button, the checkbox should stay checked.

Here is the checkbox code that I currently have:

<input type="checkbox" name="selected_items" value="{{ id }}" {% if selected %}checked="checked"{% endif %} data-confirm="Are you sure you want to uncheck this?" />

Here is the bootstrap modal code that I have:

    $(document).ready(function() {

        $('input[data-confirm]').click(function(ev) {

            var href = $(this).attr('href');

            if (!$('#dataConfirmModal').length) {

                $('body').append('<div id="dataConfirmModal" class="modal modal-confirm-max-width" role="dialog" aria-labelledby="dataConfirmLabel" aria-hidden="true"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true"><icon class="icon-remove"></icon></button><h4 class="modal-title" id="dataConfirmLabel">{% trans "Confirm" %} - {{ resume_detail_temp_value }}</h4></div><div class="modal-body"></div><div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">{% trans "Cancel" %}</button>&nbsp;&nbsp;<a class="btn-u btn-u-blue" id="dataConfirmOK">{% trans "Confirm" %}</a></div></div>');

            }

            $('#dataConfirmModal').find('.modal-body').html($(this).attr('data-confirm'));

            $('#dataConfirmModal').modal({show:true});

            $('#dataConfirmOK').click(function() {

                // handle checkbox function here.

            });

            return false;

        });

    });
user1261774
  • 3,525
  • 10
  • 55
  • 103
  • I'm guessing your click handler for `dataConfirmOK` is not even firing since you're creating that element dynamically. You should check out http://stackoverflow.com/questions/20819501/jquery-click-event-not-working-for-dynamically-created-button – Jon Rubins Nov 29 '14 at 04:31

1 Answers1

1

Is this what you're looking for?

$('#dataConfirmOK').click(function() {
    $('input[name=selected_items]').prop('checked', false);
});
sbonkosky
  • 2,537
  • 1
  • 22
  • 31