Posted 3 hours ago (permalink)
Hi everyone,
I'm doing an ASP.NET MVC project with Kendo UI, and I've got a little problem.
I have a jquery script for re sizing my splitter.
window.onload = function () {
$("#vertical").css("height", $(window).height());
};
But when I load my layout, I've got the good size, but not the good display.
If I hide my bottom splitter , and then show it, it's the well display (2.png)
Thanks all for you answers :)
Did you try the following css #vertical{height:100%;} ?
Related
I've been searching for an hour on how to nagivate within my Laravel website without refreshing the website (page layout), but I couldn't find a proper solution: one that not just loads the HTML, but actually replaces the content view within the layout.
This is my current dashboard:
So when clicking on a menu item within the blue area, I want the red content area to change without page refresh. What would be a scalable solution for this? I'm trying to follow the DRY (Don't repeat yourself) principle as much as possible.
Oh, please don't mark this topic as a clone of other topics as I've seen most of them but without proper solution. Hope anyone can help me out.
Changing a view without page load means we need to use the ajax techology. Vuejs is a frontend frameework the allows us to acomplish that easily with its axios library
I believe you can get this done by using jQuery load function -
$(function () {
$("#menu_option_a").on("click", function () {
$("#dashboard").load("View1.html");
});
$("#menu_option_b").on("click", function () {
$("#dashboard").load("View2.html");
});
});
I'm using free jqgrid and implemented column chooser to show hide columns, the functionality is working as expected but the popup that shows up doesn't have a proper rendering of UI.
I tried searching a lot and went through the documentation of free jqgrid but I don't know what am I doing wrong.
I was able to reproduce the error in demo in below url.
If any one has faced similar issue please help. Note I am using bootstrap theme.
$("#sampleGrid").navButtonAdd('#sampleGridPager',{
caption: "",
title: "Choose Columns",
buttonicon: "fa fa-table",
onClickButton: function () {
$("#sampleGrid").jqGrid('columnChooser');
}
});
https://jsfiddle.net/1vk5ku2y/2/
One needs to add jQuery UI CSS to the demo because it's required for columnChooser. You should add some jQuery UI theme, which corresponds Bootsrap CSS theme. For example
https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css
After that one get already much better results https://jsfiddle.net/OlegKi/1vk5ku2y/4/. You need to add minor CSS fixes to have the final solution.
I am facing problem for rendering the anchor by using the glass mapper in sitecore mvc.
This is the code I have used to render the link:
#RenderLink(promoWidget, x => promoWidget.Link, new System.Collections.Specialized.NameValueCollection { { "target", promoWidget.Link.Target },{"class",promoWidget.Link.Class}}, true, contents: promoWidget.Link.Text)
But when from sitecore we select the link and click on insert anchor I put the text and anchor text. When I display this link by using above code it will render link this:
product
It is showing 2 times product#product. I want to display only once #product.
How can I do this?
Appreciate the help
Thanks,
Amol
I have a navigation bar in my jgrid and I've added so many buttons that they are superimposing to each other. This way it's difficult to see which button is which.
I'd like to know how I can avoid this. Could I have two navigation bars? or a two-row bar? Maybe deleting the pager?
Thanks in advance
Natalia
I had the same problem as you and I solved it with jQuery adding more rows.
var pagerNav = $("#pagernav")
var gridnavTbody = $(pagerNav).find("tbody").first();
var navgridrows = $(pagerNav).find("td").first().siblings("td").addBack();
$(navgridrows).appendTo($(gridnavTbody));
$(navgridrows).wrap( "<tr><tr/>");
$(navgridrows).children().css("text-align","center");
$(navgridrows).attr("align","center");
$(navgridrows).children().css("float","none");
$(pagerNav).css("height","75px");
And this was the result:
Html before jQuery code
and this is after jQuery
I am creating an SPA with KendoUI-Web and my layout for the login view has a sticky header and footer. To do this my divs that make up the view need to be direct children of the body.
I use the Following Code:
objLoginPage_Layout = new kendo.View('loginPage-layout');
objLoginPage_Layout.render($('body'));
However when I look in the Chrome Developer Tools I see that the layout is wrapped in a div. This div breaks my CSS.
How can I tell KendoUI not to wrap my layout in a div?
Regards,
Scott
Use KendoUI window.
I'm doing the same as you.
Here is their example http://demos.kendoui.com/web/window/index.html
If you need, I can share my code, it is real simple, but try yourself first.
try:
var theView = new kendo.View(template, { wrap: false });
http://docs.kendoui.com/api/framework/view#methods-render