Question

我正在尝试使用JEditable附加JQuery的AutoComplete。在搜索上得到以下内容。但它似乎也没有用。

http://www.pastie.org/978610

我想将自动完成功能附加到＆lt; td＆gt; DataTable（Allan Jardine）。

是否有人有相同的代码片段？

帮助..

谢谢，

土之栈。

Answer 1

以下是Jeditable的快速自动填充自定义输入。写一些以字母“a”开头的东西。请参阅资料来源。

$(document).ready(function() {
    $.editable.addInputType('autocomplete', {
        element : $.editable.types.text.element,
        plugin : function(settings, original) {
            $('input', this).autocomplete(settings.autocomplete.data);
        }
    });

    $(".autocomplete").editable("http://www.appelsiini.net/projects/jeditable/php/save.php", { 
        indicator : "<img src='img/indicator.gif'>",
        type      : "autocomplete",
        tooltip   : "Click to edit...",
        onblur    : "submit",
        autocomplete : {
           data : ["Aberdeen", "Ada", "Adamsville", "Addyston", "Adelphi", "Adena", "Adrian", "Akron"]
        }
    });
});

Answer 2

最后我得到了它的工作.. 这是代码：

$.editable.addInputType('autocomplete', {
element : $.editable.types.text.element,
plugin : function(settings, original) {
    $('input', this).autocomplete(settings.autocomplete.url, {                                                 
            dataType:'json',
            parse : function(data) {                                                                                                                    
                                    return $.map(data, function(item){
                                        return {
                                                data : item,
                                                value : item.Key,
                                                result: item.value                                                                                     
                                               }
                                    })
                                   },
            formatItem: function(row, i, n) {                                                        
                    return row.value;
                },
            mustMatch: false,
            focus: function(event, ui) {                                                
              $('#example tbody td[title]').val(ui.item.label);
              return false;
              }
            });                                        
    }}); $("#example tbody td[title]").editable(function(value,settings){
    return value;
}, 
{                                     
    type      : "autocomplete",
    tooltip   : "Click to edit...",            
    autocomplete : 
        { 
            url : "autocompleteeg.aspx" 
        }});     oTableexample = $('#example').dataTable({
                                                         "bInfo": false
                                                          });

Json数据是：[{“Key”：“1”，“value”：“Menu Root”}，{“Key”：“2”，“value”：“Menu Item 1”}]

我错过了Jeditable中的javscript函数。我想在用户选择值后调用javascript函数。

此示例使用AutoComplete（BAssistance），DataTable（Allan Jardine）和JEditable（Mike Tuppola）。现在我的下一个挑战是将KeyTable（Allan Jardine）整合到这个......： - ）

使用JEditable进行JQuery AutoComplete

2 个答案: