【问题标题】:DataTable + JEditable + AutoComplete(BAssistance) + Server Side ProcessingDataTable + JEditable + AutoComplete(BAssistance) + 服务器端处理
【发布时间】:2010-06-15 17:49:57
【问题描述】:

在几乎挣扎了一周之后,我已经能够使用 Json 使 DataTable + JEditable + AutoComplete(BAssistance) 与服务器端处理一起工作。 我认为这对那里的人会有用。

$(document).ready(function() {
    $('#example tbody td').editable(
        function(value, settings) {
            processEventForTable(this, value);
            return(value);
        },
        "height": "20px"
    });
    oTableexample = $('#example').dataTable({
        "bInfo": true,
        "bProcessing" : true,
        "bServerSide" : true,
        "sAjaxSource" : "GetPaginationData.aspx",
        "sPaginationType": "full_numbers",
        "bPaginate"      : true,
        "fnServerData": function ( sSource, aoData, fnCallback ) {
            var data = {"name" : "kObjectId",
            "value" : definitionId};
            aoData.push(data);
            data =  { "name" : "ObjectName", "value" : "example" };
            aoData.push(data);
            data = { "name" : "InstanceId", "value" : instanceId };
            aoData.push(data);
            data = { "name" : "IsNewRequest", "value" : IsNewRowAdded};
            IsNewRowAdded = 0;
            aoData.push(data);
            debugger;
            $.ajax( {
                "dataType": 'json',
                "type": "Get",
                "url": sSource,
                "data": aoData,
                "success": fnCallback
            });
        },
        "fnDrawCallback" : function() {
            debugger;
            SetDataTableIDAndAttachJEditable("example");
            $('#example tbody td').editable( function(value, settings)
            {
                var aPos = oTableexample.fnGetPosition( this );
                processEventForTableNew(aPos[0], aPos[1], value, "example");
                return(value);
            }
            );
        }
    });
    $.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 > span[title]").editable(
        function(value,settings){
            return value;
        },
        {
            type      : "autocomplete",
            tooltip   : "Click to edit...",
            autocomplete : {
                url : "autocompleteeg.aspx"
            }
        }
    );
});

这段代码运行良好。

DataTables 使用服务器端处理。我正在将 JEditable 的更改提交给 javascript 函数。从那里提交,我将整个更改数组提交到服务器。

这段代码太长了,谁能帮我重构一下。 如果有更好的方法来完成同样的事情,那么我正在等待它。 :)

【问题讨论】:

  • -1 代码缩进如此混乱(在我编辑之前)
  • +1,但这个非问题不应该是社区维基吗?

标签: jquery-plugins autocomplete datatables jeditable


【解决方案1】:

是的,帅哥! 只是代码中的一个小语法错误。

} , {  // opening bracket missing
    "height": "20px"
}

非常感谢

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-11-29
    • 2019-04-10
    • 2015-12-08
    相关资源
    最近更新 更多