javascript checkbox - uncheck only on bootstrap modal OK

Question

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;

        });

    });

Answer 1

Is this what you're looking for?

$('#dataConfirmOK').click(function() {
    $('input[name=selected_items]').prop('checked', false);
});