Использование атрибута данных для передачи данных в модальное состояние и использования указателя даты внутри этого модального режима без потери данных атрибутов данных. - PullRequest
0 голосов
/ 19 сентября 2018

У меня возникла проблема при использовании атрибута data для передачи данных в модальное состояние и использования DatePicker внутри этого модального режима.когда я это сделал и, как только я щелкнул по вводу даты, все данные, которые я передал другим входам через атрибут данных, очищаются.Кто-нибудь может объяснить, как это происходит и есть ли способ преодолеть эту проблему?

мой код следующим образом.

<i class="btn icon-md icon-pencil" data-toggle="modal" data-target="#edit_data_modal" data-bundle_id="1"></i>

<div class="modal bs-example-modal-lg inmodal" id="edit_data_modal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content animated bounceInRight">
            <div class="modal-header">

            </div>
            <form method="post" id="edit_form" action="" class="form-horizontal">
                <div class="modal-body">
                    <input type="text" class="form-control" name="bundle_id" id="bundle_id" required>
                    <input type="text" class="form-control date-picker" name="start_date" required>
                    <input type='submit' value='Save'>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
$('.date-picker').datepicker({
    orientation: "top auto",
        format: "yyyy-mm-dd",
        autoclose: true
});

$('#edit_data_modal').on('show.bs.modal', function (event) {
    var button = $(event.relatedTarget); // Button that triggered the modal
        var bundle_id = button.data('bundle_id'); // Extract info from data-* attributes
    var modal = $(this);
    modal.find('.modal-body #bundle_id').val(bundle_id);
});
</script>

JS Fiddle

1 Ответ

0 голосов
/ 19 сентября 2018

вам, возможно, придется правильно отделить вашу кнопку от вашей модальной.Вы уверены, что ваша цель соответствует вашей кнопке?Кстати, в jquery не нужно указывать несколько селекторов в этой строке:

modal.find('.modal-body #bundle_id').val(bundle_id); --> modal.find('#bundle_id').val(bundle_id); // Should be sufficient

Вот рабочий JSFiddle: https://jsfiddle.net/j8wzen73/6/

...