Member 10212775 Ответов: 1

Bootstrap model close подтверждающее сообщение об изменении данных

дорогие члены,

Я делаю проект в mvc. У меня есть мои формы в bootstrap модели для сохранения,и мне нужно показать сообщение, если я набрал что-нибудь в любом поле ввода и нажал кнопку Закрыть.

- Данные Не Сохранены. Вы уверены, что хотите оставить форму без сохранения данных" мне нужно показать пользователям подтверждающее сообщение.


пожалуйста помочь

Что я уже пробовал:

ВАР несохраненные = ложь;
$(":input"). change(функция () {
несохраненные = истина;
});



$('#createJobFunction').на (скрытые.БС.функция модальных', (е) {
предупреждение ("функция задания не сохранена. Вы уверены, что хотите уйти, не сохранив данные?");
})




я попытался вызвать событие модели' hidden.bs.modal'. но он стреляет и по подчиненным. я ДНТ хочу, чтобы это было уволено, когда я отправлю форму

1 Ответов

Рейтинг:
4

Karthik_Mahalingam

попробовать это

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

    <script>


        $(function () {

            var unsaved = false;
            $(":input").change(function () {
                unsaved = true;
            });

            $('#btnCancel').click(function () {
                if (unsaved) {
                    var flag = confirm("Job Function Not Saved. Are you Sure you want to leave with out saving the data?");
                    if (flag)
                        $('#mymodal').modal('hide');

                }
                else
                    $('#mymodal').modal('hide');

            });

        });
    </script>

</head>
<body>


    <h4>Departments</h4>
    <a class="btn btn-success" data-toggle="modal" data-target="#mymodal">
        <span class="glyphicon glyphicon-eye-open"></span>View
    </a>
    <div class="modal fade" id="mymodal">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button data-dissmiss="modal" class="close"><span>&times;</span> </button>
                    <div class="modal-title">My modal</div>
                </div>
                <div class="modal-body">

                    <input type="text" />
                    <input type="text" />
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary" id="btnSubmit">Submit</button>
                    <button class="btn btn-default" id="btnCancel">Cancel</button>

                </div>

            </div>
        </div>
    </div>


</body>
</html>



демонстрация : Bootstrap Modal Cancel event - JSFiddle[^]