Ошибка jQuery или jqGrid в Internet Explorer

Question

Глядя на следующий пример jqGrid

http://members.iinet.net.au/~maximg1/Demo/jqGridBug.htm

(имя пользователя: PublicAccess, пароль: 12345678)

Вы заметите, что кнопки выбора по умолчанию отключены и включены в щелчке выбранной строки:

beforeSelectRow: function (ID, event) {
    $("#" + _LastSelectedRow + "_SaveButton").button("disable");
    $("#" + _LastSelectedRow + "_DeleteButton").button("disable");
    $("#" + ID + "_SaveButton").button("enable").click(function (event) {
        event.stopPropagation(); event.preventDefault();
    });
    $("#" + ID + "_DeleteButton").button("enable").click(function (event) {
        event.stopPropagation(); event.preventDefault();
    });
    _LastSelectedRow = ID;
} 

Вы также заметите, что в объявленном объявлении для кнопок они отключены, а для предотвращения обратных передач:

$(".DeleteButton").button({ icons: { primary: 'ui-icon-closethick' }, text: false,
     disabled: true }).css({ width: "45px" }).click(function (event) {
         event.stopPropagation(); event.preventDefault();
});
$(".SaveButton").button({ icons: { primary: 'ui-icon-check' }, text: false,
     disabled: true }).css({ width: "45px" }).click(function (event) {
         event.stopPropagation(); event.preventDefault();
}); 

Поведение точно такое же, как и в Firefox, и в Chrome, но старый добрый IE выдает обратную передачу, когда СТРОКА, КОТОРАЯ НЕ ВЫБРАНА, нажимается В КОЛОННЕ КНОПКИ . Поведение соответствует ожидаемому при щелчке на одном из других столбцов, таких как описание.

Я не могу понять, почему это происходит, и это навсегда было бы в долгу перед каждым, кто мог бы пролить свет на эту ситуацию.

PS: я знаю, что я подключаю обработчики событий для кнопок дважды в двух разных точках, и это было сделано только как последняя попытка решить проблему (очевидно, не сработало).

Answer 1

Ваша основная проблема в том, что вы не указываете атрибут type кнопок, которые вы создали.Значения по умолчанию отличаются в разных браузерах.Если тип submit, у вас будут дополнительные проблемы.Известны проблемы с отключением кнопок отправки.Я не уверен, что вам действительно нужно вообще что-либо отправлять.Вероятно, вам будет достаточно только вашего собственного обработчика событий click.Если вам нужно отправить, то вы можете использовать кнопки с type="button", но вызвать форму отправки

$("#form1").submit();

внутри дескриптора события click.Модифицированную версию вашего кода вы можете увидеть здесь .Я вызываю $("#form1").submit() только внутри дескриптора события click кнопки «Сохранить», а не для кнопки «Удалить».Еще одним недостатком формы отправки будет перезагрузка страницы и удаление выделения сетки.

Более того, в модифицированной версии вашего кода я исправил несколько небольших, но важных ошибок и сделалнекоторые небольшие улучшения кода:

1. Ваш исходный код загрузил некоторые JavaScripts из jqGrid дважды из-за использования grid.loader.js дополнительно к другим сценарии разработки .
2. Исходный код, используемый ui.multiselect.js и jquery.searchFilter.js, который необходим для загрузки jquery.searchFilter.css и ui.multiselect.css также.
3. YouHTML-страница должна содержать <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> в заголовке страницы.
4. Вы можете загружать данные jqGrid более эффективно и легко, используя параметр data в jqGrid вместо использования addRowDatamethod.
5. Вместо использования localReader: {id: 'ID'} вы можете использовать опцию key:true для столбца ID.Лучше читать, и он работает со всеми datatype значениями, а не только с локальными данными.
6. Внутри beforeSelectRow не следует использовать click привязку без отмены привязки изпредыдущий обработчик.Если вы вставите alert("in click") в ваш текущий код функции, которую вы связываете, вы увидите, что после каждого выбора одной и той же строки функция alert будет вызываться много раз (дважды, трижды и так далее).Таким образом, чтобы исправить ваш код, вы должны удалить любую click привязку внутри beforeSelectRow.Вы связали уже один click дескриптор события один раз в начале (см. $(".DeleteButton").button(...).click внутри gridComplete).
7. Как я описал выше, вы должны добавить type=\"button\" во фрагмент HTML-кода, который выпоместите в столбец Option.
8. Поскольку вы устанавливаете только одно значение ячейки, лучше использовать метод setCell вместо setRowData метода.
9. Вы должны увеличить ширинустолбец Options, чтобы увидеть вставленные кнопки в одной строке в браузере Google Chrome.В моей измененной версии я использовал width:98 вместо оригинального width:96.
10. Некоторые небольшие изменения в коде HTML рекомендуется сделать код допустимым XHTML 1.0 Transitional или XHTML 1.0 Strict код.(см. комментарии на измененной странице)