Easy-UI: add the DataGrid toolbar button dynamically

The modification made on the basis of the predecessors did not know where he referenced it, so he did not paste the reference address.

The original code does not support 1.3.6.

Modification function:

1. If no tool has been added before, you cannot use this method (repaired );

2. It is estimated that 1.3.6 is not supported, so the button cannot be deleted under 1.3.6 (repaired );

3. added a button to delete the button container;

 

Plug-in code:

 

$.extend($.fn.datagrid.methods, {    addToolbarItem: function (jq, items) {        return jq.each(function () {            var toolbar = $(this).parent().prev("div.datagrid-toolbar");            //judge does it include toolbar object            //if don‘t have add one             if (toolbar.length == 0) {                toolbar = $("<div class=\"datagrid-toolbar\"><table cellspacing=\"0\" cellpadding=\"0\"><tr></tr></table></div>").insertBefore($(this).parent());            }            var tr = toolbar.find("tr");            for (var i = 0; i < items.length; i++) {                var item = items[i];                var btns = $(this).parent().prev("div.datagrid-toolbar").find("tr>td").children("a");                var cbtn = null;                btns.each(function () {                    var text = null;                    text = $(this).data().linkbutton.options.text;                    if (text == item.text) {                        cbtn = $(this);                        text = null;                        return false;                    } else {                        text = null;                        return;                    }                });                if (item === "-") {                    $("<td><div class=\"datagrid-btn-separator\"></div></td>").appendTo(tr);                } else {                    if (cbtn) {                        cbtn[0].onclick = eval(item.handler || function () { });                        cbtn.css("float", "left").linkbutton($.extend({}, item, { plain: true }));                    } else {                        var td = $("<td></td>").appendTo(tr);                        var tool = $("<a href=\"javascript:void(0)\"></a>").appendTo(td);                        tool[0].onclick = eval(item.handler || function () { });                        tool.linkbutton($.extend({}, item, { plain: true }));                    }                }            }            toolbar = null;        });    },    removeToolbarItem: function (jq, param) {        return jq.each(function () {            var btns = $(this).parent().prev("div.datagrid-toolbar").find("tr>td").children("a");            var cbtn = null;            if (typeof param == "number") {                cbtn = btns.eq(param);            } else if (typeof param == "string") {                var text = null;                btns.each(function () {                    text = $(this).data().linkbutton.options.text;                    if (text == param) {                        cbtn = $(this);                        text = null;                        return;                    }                });            }            if (cbtn) {                var prev = cbtn.prev()[0];                var next = cbtn.next()[0];                if (prev && next && prev.nodeName == "DIV" && prev.nodeName == next.nodeName) {                    $(prev).remove();                } else if (next && next.nodeName == "DIV") {                    $(next).remove();                } else if (prev && prev.nodeName == "DIV") {                    $(prev).remove();                }                cbtn.remove();                cbtn = null;                btns = $(this).parent().prev("div.datagrid-toolbar").find("tr>td").children("a");                if (btns.length == 0) {                    $(this).parent().prev("div.datagrid-toolbar").remove();                }            }        });    }});

 

 

 

Usage:

$ ('# Tt '). dataGrid ("addtoolbaritem", [{"text": "XXX"}, "-", {"text": "xxxsss", "iconcls ": "icon-OK"}]) $ ('# tt '). dataGrid ("removjavaslbaritem", "getchanges") // Delete $ ('# tt') based on the text of BTN '). dataGrid ("removjavaslbaritem", 0) // delete a table by subscript