Questions on Kendo UI for jQuery Forum

4 answers

123 views

Filter Date Range End date not filtering

Hi,

I'm able to filter the grid between two date ranges but if the users just enters the 2nd date and leaves the first date bank I'm not able to filter those results. Need some help getting the end date to filter as well.

Here is code below:

function FilterGrid() {

var grid = $("#grid").data("kendoGrid");

var orderDateFromFilter = $("#FromDate").val().split('-');

var orderDateToFilter = $("#ToDate").val().split('-');

if (orderDateFromFilter == "") {

orderDateToFilter = "";

$("#ToDate").val("");

$("#text5").val("");

$("#text6").val("");

}

else if (orderDateToFilter == "") {

$("#ToDate").val($("#FromDate").val());

$("#text6").val($("#text5").val());

orderDateToFilter = orderDateFromFilter;

}

var mydate1 = new Date(orderDateFromFilter[0], orderDateFromFilter[1]-1, orderDateFromFilter[2]);

var mydate2 = new Date(orderDateToFilter[0], orderDateToFilter[1]-1, orderDateToFilter[2]);

var filter = { logic: "and", filters: [] };

filter.filters.push({ field: "FilterByDate", operator: "gte", value: mydate1 });

filter.filters.push({ field: "FilterByDate", operator: "lte", value: mydate2 });

if (orderDateFromFilter== "" && orderDateToFilter == "")

filter = "";

grid.dataSource.filter(filter);

}

Grid

answered on 04 Mar 2021

1 answer

174 views

Why is the Grid apply a div with Cover class

using kendo version 2015.3.1111 (limitation to this version due to other maximum targets of system)

I've noticed using the kendo Grid that the below element is added to the DOM for each column (note the positioning is different per column):

<div class="cover" style="left: 47px; top: 1932.15px; width: 90px; height: 30px; position: absolute;">

On edit and save/cancel of a row this element is duplicated again and again. I noticed the issue as I hide an element on the main page when i hit edit in the grid and the positioning then changed and the hover/clickable area of the button was not on top of the button.

Note that if i override the style with display: none i fix the clicking issue without any noticeable side-effects however the DOM is still polluted with these numerous div elements.

Can anyone provide some insight and/or a resolution to remove these elements?

Grid

answered on 04 Mar 2021

1 answer

148 views

custom attribute for tiles

I want to identify or handle the tiles separately through JavaScript by the id or custom attribute e.g. data-functional-id.

is there any provision which will allow me to add custom attribute to the tiles?

TileLayout

answered on 04 Mar 2021

1 answer

125 views

2 type of e on databind

Hi,

At the moment I have no items in the Scheduler. After investigating I came to the conclusion there are 2 types of e given from the scheduler. I know because I handled the databound like this:

function scheduler_dataBinding(e) {
console.log(e);
}

When I do so I have the following log in the console shown in the attachement.

I think that because of the second databound, there are no items in the scheduler.

Kind regards,

Roel Alblas

Scheduler

answered on 04 Mar 2021

5 answers

294 views

Excel Export Rows Missing

I am running into an issue where the Excel Export from my grid seems to be randomly missing rows. As an example, I can see in Firebug that my REST service is returning 1,735 rows of data. But when I export to Excel, the exported file and the excelExport event only shows 1,728 rows. And that includes the Excel headings, so I should be seeing 1,736. Other examples may be off by 1 or 2 rows. And some are working exactly right. Any thoughts on how to resolve this are appreciated.

I am using serverPaging and Kendo UI 2016.1.125.

excelExport Event

excelExport : function(e) {

// debug

var sheet = e.workbook.sheets[0];

alert(sheet.rows.length);

}

dataSource

var ds = new kendo.data.DataSource({

type: "json",

pageSize:100,

transport: {

read: "../myurl"

},

serverPaging: true,

schema: {

model: {

id: "rn",

fields: {

rn: { type: "number"},

invno: { type: "string", editable: false},

....

} // end fields

}, // end model

data: "invoices",

total: "total" //have to have this with serverPaging set to true

},

error: function (e) {

console.log("error ---> Status: " + e.status);

}

});// end datasource

Data Returned from REST Service

{

"total": 1735,

"invoices":

[

{

"rn": 1,

"invno": "12345",

...

},

....

{

"rn": 1735,

"invno": "67890",

...

}

]

}

Grid

answered on 03 Mar 2021

4 answers

267 views

How to set multiple date in the calendar with mvvm?

How to set multiple date in the calendar with mvvm.

I have my calendar :

<div id="calendar1" data-role="calendar"

data-bind="value: Cvalue,

dates: Csource,

events:{change: ConChange}">

</div>

JS, view model:

Cvalue:null,

Csource:[],

Conchange:function(){

}

Csource contains:

[

{"nome":"1"},{"data":"21/112017"},

{"nome":"2"},{"data":"22/112017"},

{"nome":"3"},{"data":"26/112017"},

{"nome":"4"},{"data":"28/112017"},

{"nome":"5"},{"data":"29/112017"}

]

Cain i see this dates with different color in the calendar?

and at onChange of day, i'd like to print the name of date;

Calendar

answered on 03 Mar 2021

1 answer

104 views

How to achieve this using kendo timepicker which we use in C# mvc. If the user types a '3' the data goes to goes to '3:00 AM' (first item in the list)

I want to achieve the above mentioned scenario. Where if user types 3 on the input field of Kendo timepicker it must show the list of time starts with 3. For example(from 3:00,3:59 AM/PM)

DatePicker

answered on 03 Mar 2021

4 answers

316 views

Treelist: Both the loading and collapse icons appear at the same time

When I expand a parent, the loading and collapse icons appear simultaneously and the UI looks awkward. The collapse icon spins when the loading of children happens. How can I prevent this? I would like the k-i-collapse icon to appear only after the loading finishes.

TreeList

answered on 02 Mar 2021

3 answers

321 views

Including the Expression Preview in parameters via read transport jQuery

What I assumed would be fairly straightforward has vexed me for several days now -

I'm trying to pass the Expression Preview string along with some additional custom security vars when the filter is loaded and obviously when re-applied.

I've tried filter.getOptions, sender._previewContainer, I even tried $( '.k-filter-preview' ).text() but I am running into issues of inconsistency regarding timing of availability.

My JS/jQuery is mediocre as its really only been my secondary, or even tertiary, approach of choice, until very recently so feel free to add ...dummy to an suggested resource. :)

Thanks.

Filter

answered on 02 Mar 2021

3 answers

324 views

Cell Style in Json Data

Hello.

I'm developing with Kendo Grid and I have a question about styling cell of every row.

I've already read some articles to style every cell in databound event.

Can I add styling rule in JSON Data Passed to Kendo Grid?

In my case I have a datatable(vb.net) that I convert to json before pass to kengo grid.

My datatable has 3 column and 50 rows.

1° col: Name / 2° col: Surname / 3° col: Style.

Every row can have a different "Style" content. "Style" is the style that I need to apply to 1° and 2° column.

Example:

PAUL BEAN color:red;

STEVE JOBS text-align:center;

SAM SMITH background-color: green;

{"data":[{"Name": "Paul", "Surname":"Bean","Style":"color:red"}, {"Name": "Steve", "Surname":"Jobs","Style":"text-align:center"}, {"Name": "Sam", "Surname":"Smith","Style":"background-color: green;"}]}

Can you explain If is possibile styling on json "data"?

I've already use databound event and I Iterate every rows but it is very slow.

Are there any alternatives?

thanks!

Grid

answered on 02 Mar 2021