Проблемы с указателем даты

Question

Я надеюсь, что вы можете помочь мне с этим. Я использую jquery datepicker в модальном диалоге. После некоторых проблем в начале (заданных z-index) он работает просто отлично. Дело в том, что в моей странице есть содержимое, которое продолжает изменяться через свойство .innerHTML элементов div. Для этого случая я загружаю содержимое модального окна через частичное представление, подобное этому:

<div id = "newNotificationModalBox">
                <% Html.RenderAction("CreateNotification", "Notification"); %>
</div>

У меня есть кнопка Добавить, которая не отправляет мою форму, потому что я не заинтересован в том, чтобы покинуть страницу, она просто вызывает через ajax, чтобы внести изменения в базу данных, и отображает таблицу с вставленными данными. справа. Это позволит пользователю продолжать вставлять строки в базу данных, пока он, наконец, не решит отправить изменения, поэтому строки будут вставлены. До сих пор он работает просто отлично, я открываю диалоговое окно, и сборщик даты работает отлично.

Проблема возникает только в этом случае. Всякий раз, когда пользователь нажимает кнопку «Добавить», и любое из полей не было заполнено должным образом, я принимаю ответ от вызова ajax, чтобы показать ошибки:

var view = $.ajax({
            type: "POST",
            url: "/Suspension/CreateTemporalSuspension1SF1C",
            data: dataString,
            async: false

        });
///
///Checks if the input has been valid, if not it will go to this point
///
        document.body.innerHTML = view.responseText;

        $("#Calendar").datepicker('destroy');
        var dateoptions = { dateFormat: 'dd/mm/yy' };
        $("#Calendar").datepicker(dateoptions);

Но календарь больше не работает. Любая подсказка, почему это происходит таким образом? Я знаю, что проблема заключается в том, что когда я перезагружаю содержимое страницы, изменяя innerHTML, вы знаете какой-нибудь патч вокруг этого?

Answer 1

Если вам просто нужно отобразить сообщение об ошибке с сервера, вам не нужно использовать innerHTML, потому что, как вы уже догадались, это уничтожило ваш календарь. Вы можете просто jQuery манипулировать вашей структурой DOM. Вы можете решить использовать div-заполнитель для ошибок (который изначально будет пустым), затем вы можете добавить к нему некоторое содержимое (в случае ошибки с сервера) и позже использовать .empty () для удаления детский див. Заполнитель div не обязательно должен быть в HTML, но может быть создан динамически на лету. Я подозреваю, что вы могли бы легко решить свою проблему, манипулируя своей структурой DOM и избегая побочных эффектов, связанных с удалением данных с помощью innerHTML.

Answer 2

Вы пробовали:

$(document.body).html(view.responseText);

Вместо: document.body.innerHTML = view.responseText;

Кроме того, вы должны уничтожить средство выбора даты, прежде чем заменить его ответом.

Так что-то вроде:

var view = $.ajax({
            type: "POST",
            url: "/Suspension/CreateTemporalSuspension1SF1C",
            data: dataString,
            async: false

        });
///
///Checks if the input has been valid, if not it will go to this point
///
        $("#Calendar").datepicker('destroy');
        $(document.body).html(view.responseText);

        var dateoptions = { dateFormat: 'dd/mm/yy' };
        $("#Calendar").datepicker(dateoptions);

Я согласен с Khnie, что вам определенно следует использовать div специально для проверки ошибок и сообщений вместо замены всего содержимого body.