JQuery JEditables отправки на вкладке

Question

Я создаю встроенную редактируемую таблицу, используя jQuery и редактируемый плагин.

Пока он работает хорошо, но будет отправлять и сохранять в базе данных только после нажатия ENTER. Я нашел здесь ветку, которая помогла мне переключаться между полями, но она не отправляет данные при нажатии клавиши TAB.

Мой код, который позволяет мне переключаться между полями, выглядит следующим образом:

$('.editScheduleRow').bind('keydown', function(evt) {

    if (evt.keyCode==9) {

        var nextBox='';
        var currentBoxIndex=$(".editScheduleRow").index(this);

        if (currentBoxIndex == ($(".editScheduleRow").length-1)) {
            nextBox=$(".editScheduleRow:first");         //last box, go to first
        } else {
            nextBox=$(".editScheduleRow").eq(currentBoxIndex+1);    //Next box in line
        }

        $(this).find("input").blur();
        $(nextBox).click();  //Go to assigned next box

        return false;           //Suppress normal tab

    };

});

Для отправки с помощью ENTER я использую это:

$(".editScheduleRow").editable("../../includes/ajax/save-schedule-row.php", {

    "submitdata": function ( value, settings ) {
        return { fieldname: this.getAttribute('fieldname'), rowID: this.getAttribute('id') };

    },

});

Я также нашел ветку с предложением, но у меня это не сработало: jEditable отправляет на TAB и ENTER

Пожалуйста, дайте мне знать, если вам нужна дополнительная информация.

Answer 1

Мой первоначальный ответ был основан на прочтении документации по jQuery Editable, который является расширением jQuery с аналогичным именем, но не совпадает с jEditable из вопроса. Давайте попробуем еще раз с правильной библиотекой.

Проблема заключается в том, что вы перемещаете фокус от поля ввода при нажатии на вкладку, но когда фокус перемещается от него, он не сохраняет содержимое. Чтобы проиллюстрировать это, попробуйте следующее: щелкните по одному из полей и отредактируйте его, затем щелкните в другом месте документа. Вы увидите, что значение в таблице - и это то, что вы имитируете, используя blur() Функция jQuery для элемента.

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

    [..]
    "submitdata": function ( value, settings ) {
        return { fieldname: this.getAttribute('fieldname'), rowID: this.getAttribute('id') 
    };
    "onblur": "submit";
},
[..]

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

замените эту строку:

    $(this).find("input").blur();

этим:

    $(this).find("form").submit();

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