JSON example - add a link?!

Morning!

Evaluating DHTMLX, and I’ve built up some workable examples for menus, using XML, that fit our needs.

One requirement, however, is to employ JSON wherever possible. I’ve seen a JSON example, but that example is too simplistic - it LOOKS good, but it contains no actual links (HREFs?), and I can find no documentation that explains how to specify such a link.

A pointer to either a working example, or to the documentation, would be much appreciated.

Will.

Hello,

unfortunately HREFs can’t be set by JSON.

Morning!

We’ve implemented a solution that allows us to initialize dhtmlxMenuObject from JSON. Your implementation was already close, and one of our developers extended the method to include

dhtmlXMenuObject.prototype.items=function(arr,parent){
	var pos = 100000;
	var lastItemId = null;
	for (var i=0; i < arr.length; i++) {
		var item=arr[i];
		if (item.type == "separator") {
			this.addNewSeparator(lastItemId, pos, item.id);
			lastItemId = item.id;
		} else {
			this.addNewChild(parent, pos, item.id, item.text, item.disabled, item.img, item.img_disabled);
			if (item.href){this.setHref(item.id,item.href,item.target)};
			if (item.tooltip){this.setTooltip(item.id,item.tooltip)};
			lastItemId = item.id;
			if (item.items) this.items(item.items,item.id);
		}
	}
};

The lines above, where we check if the item contains an ‘href’ or a ‘tooltip’, were the only two changes to your implementation.

This code change now allows this:

function initMenu() {
    var menuData = {
        parent: "menuObj",
        icon_path: "../common/imgs/",
        items: [{
            id: "file",
            text: "File",
            items: [{
                id: "new",tooltip:"Selects new menu item",href:"http://www.logicent.com/",target:"_blank",
                text: "New",
                img: "new.gif"
            }, {
                id: "sep0",
                type: "separator"
            }, {
                id: "open",
                text: "Open",href:"http://www.logicent.com/",
                img: "open.gif"
            }, {
                id: "save",
                text: "Save",
                img: "save.gif"
            }, {
                id: "saveAs",
                text: "Save As...",
                disabled: true,
                img_disabled: "save_as_dis.gif"
            }, {
                id: "sep1",
                type: "separator"
            }, {
                id: "print",
                text: "Print",
                img: "print.gif"
            }, {
                id: "pageSetup",
                text: "Page Setup",
                disabled: true,
                img_disabled: "page_setup_dis.gif"
            }, {
                id: "sep2",
                type: "separator"
            }, {
                id: "close",
                text: "Close",
                img: "close.gif"
            }]
            }, {
            id: "edit",
            text: "Edit",
            items: [{
                id: "edit_undo",
                text: "Undo",
                img: "undo.gif"
            }, {
                id: "edit_redo",
                text: "Redo",
                img: "redo.gif"
            }, {
                id: "sep3",
                type: "separator"
            }, {
                id: "edit_select_all",
                text: "Select All",
                img: "select_all.gif"
            }, {
                id: "sep4",
                type: "separator"
            }, {
                id: "edit_cut",
                text: "Cut",
                img: "cut.gif"
            }, {
                id: "edit_copy",
                text: "Copy",
                img: "copy.gif"
            }, {
                id: "edit_paste",
                text: "Paste",
                img: "paste.gif"
            }]
            }, {
            id: "help",
            text: "Help",
            items: [{
                id: "about",
                text: "About...",
                img: "about.gif"
            }, {
                id: "help2",
                text: "Help",
                img: "help.gif"
            }, {
                id: "bugrep",
                text: "Bug Reporting",
                img: "bug_reporting.gif"
            }]
            }]
        };
    menu = new dhtmlXMenuObject(menuData);
    menu.setIconsPath("/imgs/");
}

For your consideration.

We plan on creating/managing extensions to the DHTMLX library, but ideally we’d rather this change be incorporated into your codebase.

Can you tell me if/when this may be done?

Will.

Hello Will,

thank you very much for the provided code. It will be useful for other customers.

But we are not sure that JSON initialization will be included into official version - it isn’t popular functionality. We’ll think it over.

JSON initialization isn’t a popular functionality? With all do respect, I don’t think so…