When the page loads that has my Splitter on it, it shows up as un-formatted. After a second or two, the page then changes to show the correct splitter panel layout. How can I change this so that it doesn't show the un-formatted splitter first? See attached screen shots...
Hi,
Trying to create a TreeList view, but the data set is too large. exceed maxJson limit.
So I'd like to load on demand. Bring back the 1st level where the parentId string is null and then as each node is cliked have it return the next set of data. I've a similar thread where the suggestion was to look at the emploeedirectory example, but don't see how that works per say.
While trouble-shooting have noticed that trying to restrict the intial data request to just the top items where parentId is null does not work. Tried to set default value for parentId as well but still does not work - "No Records to display"
However, changing the default parentId to a value and retricting the data query to that same value does return the items where their parent is the specified default value.
I'm assuming there would be an inital query that brings back the top level items, but how would it show if there are sub items to select?
Secondly, when a node is clicked would there need to be a clicked event that calls the controller to update the TreeList?
Here is the controller method:
public ActionResult GetBoms([DataSourceRequest] DataSourceRequest request)
{
var db = new EmsDashDev();
var results = db.NHAItems.ToList<NHAItems>();
var results1 = results.ToTreeDataSourceResult(request,
e => e.ComponentNumber,
e => e.NextHigherAssembly);
return Json(results1);
}
And the view code
@(Html.Kendo().TreeList<EMSCommitScheduleApp.Models.NHAItems>()
.Name("treelist")
.AutoBind(true)
.Columns(columns =>
{
columns.Add().Field(e => e.ComponentNumber).Width(280);
columns.Add().Field(e => e.ItemNumber).Width(160);
columns.Add().Field(e => e.Description);
columns.Add().Field(e => e.Qty).Width(80);
columns.Add().Field(e => e.NextHigherAssembly).Width(280);
columns.Add().Field(e => e.LevelZeroAssembly);
columns.Add().Field(e => e.AssemblyIndicator).Title("Make");
})
.Filterable()
.Sortable()
.DataSource(dataSource => dataSource
.Read(read => read.Action("GetBoms", "Home"))
.ServerOperation(true)
.Model(m => {
m.Id(f => f.ComponentNumber);
m.ParentId(f => f.NextHigherAssembly);
m.Expanded(false);
m.Field(f => f.ComponentNumber);
m.Field(f => f.ItemNumber);
m.Field(f => f.Description);
m.Field(f => f.Qty);
m.Field(f => f.NextHigherAssembly);
m.Field(f => f.LevelZeroAssembly);
m.Field(f => f.AssemblyIndicator);
})
)
.Height(540)
)
Anyone know if there is a way to set the editor template of a grid at runtime? I'm trying to change the editing mode dynamically. e.g. from inline to popup and it seems to work fine, but it seems to clear my popup editor template. Here is an example of what I'm trying to do.
grid.options.editable.mode = "popup";
grid.options.editable.template = How can I set this at runtime?
grid.editRow(row);
Hello everyone, I need to fill panel bar content with partial views. My current code is
@(Html.Kendo().PanelBar() .Name("reportFilters") .ExpandMode(PanelBarExpandMode.Multiple) .ExpandAll(true) .Animation(true) .Items(panelbar => { foreach (IFilterCategory filterCateg in Model) { panelbar.Add() .Text(filterCateg.DisplayName) .Content(@<text><div style="padding-top:5px;padding-left:5px;padding-right:5px">@Html.Action(filterCateg.Action, filterCateg.Controller, new { filterCateg = filterCateg })</div></text>); } } ))
and after reading the following post
http://www.telerik.com/forums/what-is-the-syntax-to-open-a-mvc-partial-page-inside-a-pannel-bar#hmqmhkbB-kyThT8J06ygng
i tried to achieve client side rendering by using LoadContentFrom and .Action() without success. The best try was hitting the controller but the object filterCateg is null.
Thanks in advance.

We are using code from this example Here in the databinding of our grid to conditionally set cell background color but when we turn on grouping, the code fails due to the addition of the grouping rows added. we have tried getting the child rows of the group but just cannot get the syntax right. Any help would be great.
Thanks,
Erik
for (var x = 0; x < Months.length; x++) { // get the index of the column var columnIndex = this.wrapper.find(".k-grid-header [data-field=" + Months[x] + "]").index()-1; // iterate the data items and apply row styles where necessary var dataItems = e.sender.dataSource.view(); for (var j = 0; j < dataItems.length; j++) { var group = e.sender.tbody.find(".k-grouping-row"); var row = group.children().find("[data-uid='" + dataItems[j].uid + "']"); var cell = row.children().eq(columnIndex); var monthNum = x + 1; if (x === 12) { monthNum = 12; } if (((selFY === curfyear) && (curfmon > monthNum)) || (selFY < curfyear)) { cell.addClass('disabledColor'); } }I am trying to use the Kendo UI grid with serverPaging with Angular and ASP.NET MVC. Whenever I click "next page" in the grid, when it hits my Action Method, the request object is all zeros accept for Page which is ALWAYS = 1 so my paging never happens Here is my Angular code:
<code style="color: #000;">$scope.mainGridOptions = {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> dataSource: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> transport: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> read: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> url: '/SSQV4/SSQV5/Search/GetSearch',<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> type: "GET"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> }<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> schema: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> data: "results",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> total: "Total"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> pageSize: 25,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> serverPaging: true<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">><</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> sortable: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> pageable: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> resizable: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">><</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> columns: [{<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> field: "CompanyID",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> title: "Company ID"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">><</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> }, {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> field: "CompanyName"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">><</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> }, {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> field: "City"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">><</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> }, {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> field: "State"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">><</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> }, {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> field: "Deficiencies"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> }]<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">> };</code>
Here is my MVC Controller code:
public async Task<ActionResult> GetSearch([DataSourceRequest(Prefix = "Grid")] DataSourceRequest request)<br> {<br> int pageNum = request.Page;<br> if (request.PageSize == 0)<br> {<br> request.PageSize = 25;<br> } <br> MajorID = UserInfo.intMajorID;<br> var SearchString = System.Web.HttpContext.Current.Session["SearchString"] as String ?? "";<br> strSqlQuery = " LEFT JOIN tblSSQReleaseToMajor RT (READUNCOMMITTED) ON C.CompanyID = RT.CompanyID and RT.MajorID = " + MajorID + " LEFT JOIN tblTrainingRelease TR on C.CompanyID = TR.ContractorID";<br> <br> MajorID = UserInfo.intMajorID;<br> string preSqlQuery = ""<br><br> var results = await SearchClient.PostReleasedSearch(preSqlQuery, strSqlQuery, 5000, 1);<br><br> var searchResults = new SearchResultsViewModel();<br> searchResults.Total = results.Count();<br> if (request.Page > 0)<br> {<br> results = results.Skip((request.Page - 1) * request.PageSize).ToList();<br> }<br> results = results.Take(request.PageSize).ToList();<br><br> searchResults.results = results;<br><br> return Json(searchResults, JsonRequestBehavior.AllowGet);<br><br> }
What am I missing here?

I am trying to use server-side paging in my project I am using Angular, and Asp.net MVC. Whenever click "next page" the request object values are always 0 accept for Page which is always 1. Because the page is always 1, I can't ever move to the next page.
Here is my Angular code:
$scope.mainGridOptions = {
dataSource: {
transport: {
read: {
url: '/SSQV4/SSQV5/Search/GetSearch',
type: "GET"
}
},
schema: {
data: "results",
total: "Total"
},
pageSize: 25,
serverPaging: true
},
sortable: true,
pageable: true,
resizable: true,
columns: [{
field: "CompanyID",
title: "Company ID"
}, {
field: "CompanyName"
}, {
field: "City"
}, {
field: "State"
}, {
field: "Deficiencies"
}]
};
Here is my MVC Controller code:
public async Task<ActionResult> GetSearch([DataSourceRequest(Prefix = "Grid")] DataSourceRequest request)
{
int pageNum = request.Page;
if (request.PageSize == 0)
{
request.PageSize = 25;
}
MajorID = UserInfo.intMajorID;
var SearchString = System.Web.HttpContext.Current.Session["SearchString"] as String ?? "";
strSqlQuery = " LEFT JOIN tblSSQReleaseToMajor RT (READUNCOMMITTED) ON C.CompanyID = RT.CompanyID and RT.MajorID = " + MajorID + " LEFT JOIN tblTrainingRelease TR on C.CompanyID = TR.ContractorID";
MajorID = UserInfo.intMajorID;
string preSqlQuery = ""
var results = await SearchClient.PostReleasedSearch(preSqlQuery, strSqlQuery, 5000, 1);
var searchResults = new SearchResultsViewModel();
searchResults.Total = results.Count();
if (request.Page > 0)
{
results = results.Skip((request.Page - 1) * request.PageSize).ToList();
}
results = results.Take(request.PageSize).ToList();
searchResults.results = results;
return Json(searchResults, JsonRequestBehavior.AllowGet);
}
Why is page always 1? If I click on Page 2, 3, the request object page is always 1.
Any assistance is greatly appreciated.

I have a grid in which I conditionally allow editing of a column. I do this by conditionally applying the readonly attribute, like so:
$("#my_column_name").attr("readonly", true);
Chrome 57.0.2987.98 respects this, and I can't click into the cell to edit it.
IE 11.0.9600.x, however, allows me to click into the cell and prepend values to the cell's existing value.
Thanks,
Duke

I have here a MENU which would show partial views as the content. The function openPatientDetails is a switch statement that basically just adds a class to those divs that I want to hide and removes the class to those divs that I want to show. So every time I click from the Menu which adds/removes the hidden class, I also need the url to change without reloading the browser and every time I click back or forward it should go to the partial view that I am supposed to be. I tried the history.pushState but it's so static because I need to do it for all of the tabs. Is there any way to solve this issue?
<div class="panel-body"> <div id="row_menu" class="row" style="margin-top: -15px;"> @(Html.Kendo().Menu() .Name("Menu_PatientDetails") .Items(items => { items.Add().Text("Patient Information").Selected(true).Enabled(false); items.Add().Text("Insurance").Enabled(false); items.Add().Text("Visits").Enabled(false); items.Add().Text("Notes").Enabled(false); items.Add().Text("Documents").Enabled(false); }) .Events(e=>e.Select("openPatientDetails")) ) </div> <div id="PatientInformationPanel"> @Html.Action("ShowPatientInformation", "Patient") </div> <div id="PatientInsurancePanel" class="hidden"> @Html.Action("ShowPatientInsurance", "Patient") </div> <div id="PatientYearPanel" class="hidden"> @Html.Action("ShowPatientYear", "Patient") </div> <div id="CasesPanel" class="hidden"> @Html.Action("ShowPatientCases", "Patient") </div> <div id="PatientDocumentPanel" class="hidden"> @Html.Action("ShowPatientDocuments", "Patient") </div></div>
function openPatientDetails(e) { $(e.item).addClass("k-state-selected"); $("#PatientInformationPanel").removeClass("hidden"); $("#PatientInsurancePanel").addClass("hidden"); $("#PatientYearPanel").addClass("hidden"); $("#CasesPanel").addClass("hidden"); $("#PatientDocumentPanel").addClass("hidden");}

