Question

我正在使用jQuery插件jEditable＆amp;选择使用以下脚本创建内联编辑：

$('.inline_edit_menu').editable('ajax.php', { // http://polyetilen.lt/en/jquery-jeditable-and-chosen-hybrid
    data: "{'5':'Complete - No further action','4':'Unsatisfied - additional steps required','3':'Unsatisfactory - Re-Evaluate','2':'Test','1':'Pending','0':'Not Applicable'}",    
    indicator: 'Saving...',
    tooltip: 'Click to edit...',
    style: "inherit",
    onblur: "ignore",
    type   : 'select',
    submit : 'OK',
    submitdata: function (value, settings) {
        //do stuff
    }
}).on('click', function(){
            $(this).find('select').chosen();
}).on('click', function(){
    $('select').trigger('chosen:open');  
});

这很有意思，正如这个小提琴中所见，有一点需要注意：在选择菜单项时，它并没有提交。我希望click事件能够提交所选的值，而无需单击＆＃34; OK＆＃34;。 - https://jsfiddle.net/t24ph41t/2/

通过将jEditable的onblur属性更改为select，可以轻松解决此问题。但是，当前脚本的问题是初始点击事件会自动打开＆amp;关闭选择的菜单，如这个小提琴中所示： - https://jsfiddle.net/t24ph41t/3/

我正在寻找两者的组合：如何使用所选插件选择内联元素，编辑它并选择，提交值就好像这只是一个jEditable元素？

Answer 1

我可以通过添加以下脚本来获得此功能：

$(document).on('change', '.inline_edit_menu select', function () {
    $(this).trigger("submit");
});

jEditable＆amp;选择合并

1 个答案: