jQWidgets Forums

Tagged: jqxMenu, Menu

This topic contains 8 replies, has 2 voices, and was last updated by frankbur 10 years, 6 months ago.

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

Author

got no data for menu Posts

December 4, 2014 at 4:12 pm got no data for menu #63792

frankbur

Participant

hi folks,

i dont understand it…

i have a small php file called client.php:

$row = array();
$row[“id”] = 1;
$row[“parentid”] = 1;
$row[“text”] = “Test Text”;

echo json_encode($row);

thats all.

now i have a small html-file with the menu:

$(document).ready(function () {

var url = “http://localhost/xxx/lib/client.php”;
// prepare the data
var source =
{
datatype: “json”,
datafields: [
{ name: ‘id’ },
{ name: ‘parentid’ },
{ name: ‘text’ },
],
id: ‘id’,
url: url
};

var dataAdapter = new $.jqx.dataAdapter(source);
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: ‘text’, map: ‘label’}]);

$(“#jqxMenu”).jqxMenu({ source: records, width: ‘180px’, height: ‘180px’, mode: ‘vertical’, autoCloseOnClick: false});
$(“#jqxMenu”).css(‘visibility’, ‘visible’);

});

</script>

when i call client.php standalone i got correct output:
{“id”:1,”parentid”:1,”text”:”Test Text”}

when i call the html-file i got no data, i only see the empty division…

what am i doing wrong?

regards frank

December 5, 2014 at 7:25 am got no data for menu #63811

Nadezhda

Participant

Hello frank,

Please, try the following example with ‘async’ setting which is set to false for synchronous requests (by default is set to true-asynchronous requests).

// prepare the data
var source =
{
    datatype: "json",
    datafields: [
        { name: 'id' },
        { name: 'parentid' },
        { name: 'text' },
   ],
   id: 'id',
   url: url,
   async: false
};

Best Regards,
Nadezhda

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

December 5, 2014 at 11:13 am got no data for menu #63827

frankbur

Participant

hi Nadezhda,

thanx for the answer.
i tried both, async true and false, same result: empty division…

any other suggestions?

regards frank

December 5, 2014 at 1:06 pm got no data for menu #63833

Nadezhda

Participant

Hi frank,

Here is an example with local data and works on our side. Please, check if ‘url’ is referred correctly in your code.

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../scripts/demos.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
</head>
<body>
    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
                var data = [
                {
                    "id": "12",
                    "text": "Frappuccino",
                    "parentid": "-1",
                    "subMenuWidth": '250px'
                },
                {
                    "text": "Chocolate Beverage",
                    "id": "1",
                    "parentid": "-1",
                    "subMenuWidth": '250px'
                }, {
                    "id": "2",
                    "parentid": "1",
                    "text": "Hot Chocolate"
                }, {
                    "id": "3",
                    "parentid": "1",
                    "text": "Peppermint Hot Chocolate"
                }, {
                    "id": "4",
                    "parentid": "1",
                    "text": "Salted Caramel Hot Chocolate"
                }, {
                    "id": "5",
                    "parentid": "1",
                    "text": "White Hot Chocolate"
                }, {
                    "id": "6",
                    "text": "Espresso Beverage",
                    "parentid": "-1",
                    "subMenuWidth": '200px'
                }, {
                    "id": "7",
                    "parentid": "6",
                    "text": "Caffe Americano"
                }, {
                    "id": "8",
                    "text": "Caffe Latte",
                    "parentid": "6"
                }, {
                    "id": "9",
                    "text": "Caffe Mocha",
                    "parentid": "6"
                }, {
                    "id": "10",
                    "text": "Cappuccino",
                    "parentid": "6"
                }, {
                    "id": "11",
                    "text": "Pumpkin Spice Latte",
                    "parentid": "6"
                }, {
                    "id": "13",
                    "text": "Caffe Vanilla Frappuccino",
                    "parentid": "12"
                }, {
                    "id": "15",
                    "text": "450 calories",
                    "parentid": "13"
                }, {
                    "id": "16",
                    "text": "16g fat",
                    "parentid": "13"
                }, {
                    "id": "17",
                    "text": "13g protein",
                    "parentid": "13"
                }, {
                    "id": "14",
                    "text": "Caffe Vanilla Frappuccino Light",
                    "parentid": "12"
                }]

                // prepare the data
                var source =
                {
                    datatype: "json",
                    datafields: [
                        { name: 'id' },
                        { name: 'parentid' },
                        { name: 'text' },
                        { name: 'subMenuWidth' }
                    ],
                    id: 'id',
                    localdata: data
                };

                // create data adapter.
                var dataAdapter = new $.jqx.dataAdapter(source);
                // perform Data Binding.
                dataAdapter.dataBind();
                var records = dataAdapter.getRecordsHierarchy('id', 'parentid', 'items', [{ name: 'text', map: 'label'}]);
                $('#jqxWidget').jqxMenu({ source: records, height: 30,  width: '400px' });
                $("#jqxWidget").on('itemclick', function (event) {
                    $("#eventLog").text("Id: " + event.args.id + ", Text: " + $(event.args).text());
                });
            });
        </script>
        <div id='jqxWidget'>
        </div>
        <div style="margin-top: 50px; font-size: 13px; font-family: Verdana;" id="eventLog"></div>
    </div>
</body>
</html>

Best Regards,
Nadezhda

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

December 5, 2014 at 2:31 pm got no data for menu #63837

frankbur

Participant

hi Nadezhda,

thanx for reply.

your example works, all examples with localdata works…

the reference to *url* cant be wrong(i guess), because when i call

http://localhost/xxx/lib/client.php

standalone, i got correct output.

but calling the url here

$(document).ready(function () {

i got no output anymore, only blank division.

that’s what i dont understand…

any further suggestions?

regards frank

December 5, 2014 at 2:50 pm got no data for menu #63839

Nadezhda

Participant

Hi frank,

Please, make sure all your jQWidgets files are updated to version 3.6.0.

Best Regards,
Nadezhda

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

December 5, 2014 at 3:04 pm got no data for menu #63844

frankbur

Participant

hi Nadezhda,

yes, they are all 3.6.0, i downloaded the project 4 days ago…

regards frank

December 8, 2014 at 7:21 am got no data for menu #63889

Nadezhda

Participant

Hi frank,

Could you try with another url something like this var url = "../sampledata/data.php"; without http before localhost. If this suggestion does not help you to fix the issue, please provide a full sample which we would be able to test.

Best Regards,
Nadezhda

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

December 10, 2014 at 6:43 pm got no data for menu #64052

frankbur

Participant

hi Nadezhda,

sorry for late reply, but i have only time to test on weekend.
i will try that and give you feedback.

regards, frank

Author

Posts

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

You must be logged in to reply to this topic.