Questions on Kendo UI for jQuery Forum

2 answers

285 views

Hello

I wanted the events size to be 100% of the cell.The event should occupy the whole cell . As in my application we will have only one event for a day.Is it possible.

http://dojo.telerik.com/oguzU/2

Scheduler

answered on 21 Jul 2016

1 answer

164 views

enable cache for ajax request in PanelBar

Dear all,

I use PanelBar through angular integration. I link my kendo bar with my controller thanks to k-data-source.

I use contentURL to load each panelBar. All work fine !

My problem is the cache option which is disable for ajax request : Loading of different contentURL is performed with the addition of a timestamp for the request :

e.g. : selectRecherche?_=XXXXXXXXX

I would like a classic loading of the content without that timestamp addition (for use of $templateCache). How can I disable that ! I didn't find nothing in k-options! (transport ?)

Thanks a lot

PanelBar

answered on 21 Jul 2016

1 answer

203 views

Drag & Drop ordering

Right now it seems that when drag & drop is turned on ( http://demos.telerik.com/kendo-ui/treelist/index ), and I move a row, I can only change its parent. What if I want to change the order of items ONLY?

TreeList

answered on 21 Jul 2016

2 answers

292 views

Refresh Detail Grid

Hi,

I am using multi row drag & drop Grid Feature. I have 2 grids, first contains master detail grid (#grid1) and second grid (#grid2) contains list of items. I am able to select multiple rows from grid2 and drop to grid1 as master successfully. My requirement is to add selected rows from grid2 to grid1 as child to one of the row. Once data is dropped to grid 2, how to refresh the detail grid?

Thanks,

Sanjay

Grid

answered on 21 Jul 2016

1 answer

1.2K+ views

Kendo grid Datasource transport read for POST method making multiple ajax calls

hi ,
I am using Kendo datasource transport read method in the read i am calling POST API but the API is getting called multiple times and also when the complete callback is called the API is infinitely called can you please give me the solution for this

Here is my transport function

var transportFunction = function(pageurl, reqObject) {

return {

read: {

url: pageurl,

contentType: "application/json; charset=utf-8",

type: "POST",

dataType: "json",

beforeSend: function(xhr) {

xhr.setRequestHeader('Authorization', token);

}

},

parameterMap: function(options) {

reqObject.PageSize = options.pageSize;

reqObject.PageNum = options.page;

var request = JSON.stringify(reqObject);

return request;

}

and we are calling as below:

vm.gridOptions.dataSource.transport=transportFunction(apiUrl, reqObj);

vm.gridOptions.dataSource.schema.data="docDetailsArray"

vm.gridOptions.dataSource.schema.total="totalCount"

response from server:

{

demoDetails:[],

ErrorMsg:[],

Success: true,

docDetailsArray:[

{list_of_keys_with_value1},

{list_of_keys_with_value2},

.....

]

};

Anyone face the same issue. can any body help me out why multiple xhr reqest are going

Thanks

Grid

answered on 21 Jul 2016

2 answers

1.2K+ views

Grid with 100,000s records. Issue with ServerOperation & filtering

I have a Kendo grid that is pulling 100,000s of records.
If the .ServerOperation(false) Kendo does not load any data.
If I set it to .ServerOperation(true) it will load the data however the search filters do not work.

What am I missing?
Is there a way to use .ServerOperation(false) with 100,000ss of records?

<div class="grid">

@(Html.Kendo().Grid<BusinessApplication.DTO.DTOMemberGrid>().Name("grid")

.Columns(col =>

{

col.Bound(m => m.MemberID).ClientTemplate("<a href='/members/view/#=MemberID#' class='block'>#=MemberID#</a>").Width(100).Title("ID");

col.Bound(m => m.PersonsTitle).Width(100).Title("Title");

col.Bound(m => m.FirstName);

col.Bound(m => m.LastName);

col.Bound(m => m.JobTitle);

col.Command(command => command.Custom("View")

.Click("EditItem"))

.Width(100)

.Title("View")

.HtmlAttributes(new { @class = "k-grid-details text-center", title = "View" })

.HeaderHtmlAttributes(new { title = "View" });

})

// Source & configuration

.DataSource(src => src

.Ajax()

.PageSize(10)

.ServerOperation(true)

.Sort(sort => sort.Add("MemberID").Descending())

.Read(read => read.Action("GetMembersGridItems", "Members")))

.AutoBind(true)

.Sortable()

.Resizable(resize => resize.Columns(true))

.ColumnMenu()

.Scrollable(s => s.Height("auto"))

.Pageable(pageable => pageable

.Refresh(true)

.PageSizes(new[] { 10, 50, 100, 500 })

.ButtonCount(10))

.Filterable(filter => filter

.Operators(op => op.ForDate(date => date

.Clear()

.IsGreaterThanOrEqualTo("Is after or equal to")

.IsLessThanOrEqualTo("Is before or equal to"))))

.Reorderable(reorder => reorder.Columns(true))

)

</div>

Thanks

Tom

Grid

answered on 20 Jul 2016

2 answers

194 views

treeview expandpath doesn't always call the complete function

Hi,
I'm making use of the expandPath function of the treeview, but is doesn't always call the complete function the first time, as if it doesn't do this if it takes to long or something. It works perfectly if I call the function twice but that shouldn't be the solution.

treeView.expandPath(arrPath);

treeView.expandPath(arrPath, function() {

var getitem = treeView.dataSource.get(path);

var selectitem = treeView.findByUid(getitem.uid);

treeView.select(selectitem);

treeView.trigger('select', { node: selectitem });

});

Am I missing something here what I should do different?

TreeView

answered on 20 Jul 2016

7 answers

986 views

[Solved] Disable "Edit Recurring Item" dialog for some events

We are using the Kendo Scheduler control to display a merged calendar containing events (appointments) for the current user as well as for other users. The user is allowed to modify appointments that they "own" but cannot modify other users' appointments. We use the "edit" event to check on ownership of the appointment and prevent modification if it is not owned by the current user. However, for recurring appointments we still see the "Edit current occurrence" / "Edit the series" popup dialog even if the user doesn't own the appointment. Is there any way to prevent this dialog from appearing for appointments not owned by the user?

Scheduler

answered on 20 Jul 2016

1 answer

362 views

Splitter to display on whole window

Thank you in advance for any feedback!

I am trying to have one left pane and two middle pane split on the middle. So one vertical left splitter and one horizontal splitter.

So far this is the code that I have, it does the split ok but it doesn't show in the whole page.

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />

<link rel="stylesheet" href="http://apps.fhfa.gov/_common/KendoUI/2016-Q2/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://apps.fhfa.gov/_common/KendoUI/2016-Q2/styles/kendo.default.min.css" />
<link rel="stylesheet" href="http://apps.fhfa.gov/_common/KendoUI/2016-Q2/styles/kendo.default.mobile.min.css" />

<script type="text/javascript" src="scripts/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="http://apps.fhfa.gov/_common/KendoUI/2016-Q2/js/kendo.all.min.js"></script>

</head>
<body>
<div id="example">
<div id="vertical" style="height: 100%; width: 100%" >

<div id="horizontal" style="height: 100%; width: 100%;">
<div id="left-pane">
<div class="pane-content">
<h3>Inner splitter / left pane</h3>
<p>Resizable and collapsible.</p>
</div>
</div>
<div id="center-pane">
<div class="vertical">
<div id="center-top">
<div class="pane-content">
<h3>Inner splitter1 / center pane</h3>
<p>Resizable only. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
</p>
</div>
</div>
<div id="center-bottom">
<div class="pane-content">
<h3>Inner splitter2 / center pane</h3>
<p>Resizable only.</p>
</div>
</div>
</div>
</div>

</div>
</div>

<script>
$(document).ready(function() {
$(".vertical").kendoSplitter({
orientation: "vertical",
panes: [
{ collapsible: false, size: "80%" },
{ collapsible: false, size: "20%" }
]
});

$("#vertical").kendoSplitter({
orientation: "vertical",
panes: [
{ collapsible: false, size: "100%" },
]
});

$("#horizontal").kendoSplitter({
panes: [
{ collapsible: false, size: "400px" },
{ collapsible: false },
{ collapsible: true}
]
});
});
</script>

<style>
#vertical {
height: 100%;
margin: 0 auto;
}

#middle-pane {
background-color: rgba(60, 70, 80, 0.10);
}

#bottom-pane {
background-color: rgba(60, 70, 80, 0.15);
}

#left-pane, #center-pane, #right-pane {
background-color: rgba(60, 70, 80, 0.05);
}

.pane-content {
padding: 0 10px;
}
</style>
</div>
</body>

</html>

Splitter

answered on 20 Jul 2016

3 answers

447 views

How to prevent the item drag n drop from one node to another

Hi,

I'm working on drag and drop the node item with in the same node. It is working as expected. But it allows to drag and drop the child item from one node to another. It should be prevented.

Dojo Example

Appreciate your support to fix the issue.

Thanks in advance.

TreeView

answered on 20 Jul 2016