Hi
I have made a c# web Api (
[{"Id":1,"ParentId":0,"Title":"Hem","Url":null,"Publish":"Ja","LineUp":10,"Kind":"start"} ...)
thats work fine (about 40 rows)
I have also made a client solution that works fine but it takes a long time until the page loads.
I changed from ej.web.all.min.js to ej.menu.min.js, thats helped a little but its still a "flicker" (3-4 seconds) before the page shows correctly.
Is there anything i can do? (It seems to be a litle bit faster with edge then chrome....)
Br
Mattias
Sweden
<!DOCTYPE html>
<html>
<head>
<title>Menu Test</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel='nofollow' href="Content/bootstrap.min.css" rel="stylesheet" />
<link rel='nofollow' href="Content/ej/web/default-theme/ej.web.all.min.css" rel="stylesheet" />
<link rel='nofollow' href="Content/ejthemes/responsive-css/ej.responsive.css" rel="stylesheet" />
</head>
<body>
<ul id="MainMenu"></ul>
<div id="Content"></div>
<!-- JavaScript Area -->
<script src="Scripts/jquery-1.9.1.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/ej/ej.core.min.js"></script>
<script src="Scripts/ej/ej.data.min.js"></script>
<script src="Scripts/ej/ej.menu.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
function getPageContent(Id) {
var PathApiPage = "api/Page/" + Id;
$.ajax({
dataType: "json",
url: PathApiPage,
success: function (data) {
$("#Content").html(data.TextBody);
}
});
}
function getMenu(data) {
jQuery(function ($) {
$("#MainMenu").ejMenu({
isResponsive: true,
showArrow: true,
fields: {
dataSource: data, id: "Id",
parentId: "ParentId",
text: "Title",
},
click: function (args) {
getPageContent(args.ID);
}
});
});
}
$.ajax({
isResponsive: true,
type: "GET",
dataType: "json",
url: "/api/menu",
success: function (data) {
getMenu(data);
},
error: function () {
alert("Error");
}
});
});
</script>
</body>
</html>
