jQuery UI Widgets Forums Navigation Menu, Context Menu href in jqxmenu

This topic contains 2 replies, has 3 voices, and was last updated by  Mircea Giurgiu 9 years ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • href in jqxmenu #46728

    bufffuchs
    Participant

    Hi again, I’m using the jqxMenu widget to display navi.
    my adminmenu array

    [
      {
        "id": "1",
        "parentid": "-1",
        "m_text": "Seite",
        "subMenuWidth": "250px",
        "link": "index.php"
      },
      {
        "id": "2",
        "parentid": "-1",
        "m_text": "News",
        "subMenuWidth": "500px",
        "link": "index.php"
      },
      {
        "id": "9",
        "parentid": "6",
        "m_text": "Usergruppen",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "12",
        "parentid": "16",
        "m_text": "Bonus",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "6",
        "parentid": "-1",
        "m_text": "Userverwaltung",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "8",
        "parentid": "1",
        "m_text": "Konfiguration",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "17",
        "parentid": "10",
        "m_text": "News bearbeiten",
        "subMenuWidth": "",
        "link": "http://google.de"
      },
      {
        "id": "10",
        "parentid": "2",
        "m_text": "News erstellen",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "11",
        "parentid": "16",
        "m_text": "Shoutbox",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "13",
        "parentid": "16",
        "m_text": "Umfragen",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "15",
        "parentid": "16",
        "m_text": "Menu",
        "subMenuWidth": "",
        "link": "index.php"
      },
      {
        "id": "16",
        "parentid": "-1",
        "m_text": "Diverses",
        "subMenuWidth": "",
        "link": "index.php"
      }
    ]
            <script type="text/javascript">
                $(document).ready(function () {
                	var theme = getDemoTheme();
                	var data = {$adminmenu}
                	// prepare the data
                	var source =
                	{
                		datatype: "json",
    //            		datafields: [
    //            		{ name: 'id' },
    //            		{ name: 'parentid' },
    //            		{ name: 'm_text' },
    //            		{ name: 'url' },
    //            		{ name: 'subMenuWidth' }
    //            		],
                		id: 'id',
                		localdata: data
                	};
                	// create data adapter.
                	var dataAdapter = new $.jqx.dataAdapter(source);
                	// perform Data Binding.
                	dataAdapter.dataBind();
                	// get the menu items. The first parameter is the item's id. The second parameter is the parent item's id. The 'items' parameter represents
                	// the sub items collection name. Each jqxTree item has a 'label' property, but in the JSON data, we have a 'text' field. The last parameter
                	// specifies the mapping between the 'text' and 'label' fields.
                	var records = dataAdapter.getRecordsHierarchy('id', 'parentid', 'items',
                	[
    					{ name: 'm_text', map: 'label'}
                	]);
                
                	$('#jqxWidget').jqxMenu({ source: records, height: 30, theme: theme, width: '400px' });
    //            	$("#jqxWidget").on('itemclick', function (event) {
    //
    //            		$("#eventLog").text("Id: " + event.args.id + ", Text: " + $(event.args).text() + ", URL: " + event.args.url );
    //            	});
                	$("#jqxWidget").on('itemclick', function (event) {
    
                		$("#eventLog").html("Id: " + event.args.id + ", Text: " + txt);
                	});
                });
            </script>

    how to use “link” in my menu ?

    • This topic was modified 9 years, 1 month ago by  bufffuchs.
    href in jqxmenu #46733

    Peter Stoev
    Keymaster

    Hi bufffuchs,

    The simplest way to use a link in the Menu is to create it from UL as shown in the Default Functionality demo of jqxMenu. If you want to open a link,see: http://www.w3schools.com/jsref/met_win_open.asp and use window.open function in the ‘itemclick’ handler.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    href in jqxmenu #48322

    Mircea Giurgiu
    Participant

    var source =
    {
    dataType: “json”,
    dataFields: [

    { name: “idMenu”, type: “number” },
    { name: “itemDesc”, type: “string” },
    { name: “parentID”, type: “number” },
    { name: “position”, type: “number” },
    { name: “href”, type: “string” },
    { name: “idrightType”, type: “number” },
    { name: “idRights”, type: “number” }
    ],
    id: ‘idMenu’,
    url: ‘data/menu_data.php’,
    async: false
    };

    // create data adapter.
    var dataAdapter = new $.jqx.dataAdapter(source);
    // perform Data Binding.
    dataAdapter.dataBind();
    var records = dataAdapter.getRecordsHierarchy(‘idMenu’, ‘parentID’, ‘items’, [{ name: ‘itemDesc’, map: ‘label’}]);
    $(‘#jqxMenu’).jqxMenu({ source: records, height: 30, width: ‘700px’, theme: ‘energyblue’ });
    $(“#jqxMenu”).on(‘itemclick’, function (event) {
    // $(“#eventLog”).text(“Id: ” + records.href + “, Text: ” + $(event.args).text());
    window.open(event.args.href);
    });

    I want to include href=some.php when click an menu item
    I use window.open, but how I find my link from record?

    Mircea

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.