使用jQuery，jEditable，jeditable-rails gem或任何AJAXy解決方案使表行可編輯

Question

我有一個表格，上面有數據行。 我想通過單擊行本身或編輯按鈕來編輯大部分行。

假設我有一個列出產品的表格：

• 產品名稱
• 牌
• 模型
• 價錢

我可以通過使用jQuery和jEditable來實現這一點; 並且還使用了jeditable-rails gem。 但我一次只能編輯一個單元格。

我需要的是：如果我單擊編輯按鈕或行本身。 表格中的所有這四個單元格都應該可以編輯。

Answer 1

嘗試這樣的事情：

$('td:not(.edit)').editable('', {
    onblur: 'ignore',
    submit: 'ok',
    cancel: 'cancel',
    width: 75,
    event: 'edit'
});

$('td').click(function(e) {
    // reset all editables
    var allEditables = $(this).closest('table').find('td:not(.edit)').get();
    $.each(allEditables, function(i, elm) {
        elm.reset();
    });

    // make all cells in this row editable
    $(this).parent().children(':not(.edit)').trigger('edit');
});

示例： http ： //jsfiddle.net/UMccc/221/

Answer 2

我在這里找到了正確的路徑： jQuery - 內聯編輯表行

它不使用jEditable。

它只是一個Javascript函數，但我認為它是創造力的發射台。

Answer 3

這是一個易於使用和靈活的jquery內聯可編輯插件 。 它讓你可以輕松地在任何地方，桌面或h1標簽內編輯，並且可以將任何內容整合到任何東西中。 實際上，背后的想法很簡單，有點獨特。

干杯，