Questions on Kendo UI for jQuery Forum

5 answers

536 views

Dots on Kendo Grid pagination Bar

I am getting some strange dots on Kendo grid pagination bar. How can i remove This?

Grid

answered on 12 Dec 2017

5 answers

897 views

How to send several QRCodes to one PDF file

Hello

I'm working with the KendoQRCode Widget that is working fine! I'm also using the exportPDF/SVG/Image functions that all do a great job!

Now I would like to send several created QRCodes (defined in KendoQRCode Widgets) to a single PDF file, so the user can print them all by one PDF file (see attachment). I don't know if that is possible at all so I tried several things. The closest I came to do that:

...

var qrCode = $("#qrcode").getKendoQRCode(); // Existing QRCode Widget

var draw = kendo.drawing;

var root = new draw.Group();

var code = qrCode.exportSVG({ paperSize: "A4", landscape: false }).done(function(data) {

root.append(data);

});

draw.exportPDF(root, { paperSize: "A4", landscape: true }).done(function(data) {

kendo.saveAs({

dataURI: data,

fileName: "qrcodes.pdf"

});

..

The exportImage function does not throw an error but the QRCode is not in the generated PDF file. Using the function exportSVG throws an error: "TypeError: e.transform is not a function. (In 'e.transform()', 'e.transform' is undefined)".

So I wonder how do I send several QRCodes coming from the KendoQRCode Widget(s) into a single PDF file (if possible)? The KendoQRCode Widgets are all displayed in the page and therefore programmatically accessible.

Regards

QRCode

answered on 12 Dec 2017

7 answers

577 views

Auto scroll DropDownList

Can the DropDownList options be set to auto scroll, such that list scrolls when the mouse pointer reached the top of bottom of the container?

I tried autoScroll: true, but that has no effect.

DropDownList

answered on 11 Dec 2017

3 answers

1.0K+ views

Validate a div element

I have a two boxes that were previously input elements and are now inline html editors. Can any other element that are not a 'input' element be added onto the validator's list of things to check. The use is in a list view. Or would the only solution be having some hidden elements?

1.<div class="WebDescriptionEditor" data-bind="value: WebDescription" data-role="editor"

2. contentEditable="true"

3. data-tools="['bold','italic','underline','strikethrough']">

4.</div>

Thats basically it. The work around i have otherwise is to include a hidden input element after each of the the divs as so:

1.<input type="hidden" name="WebDescription" data-bind="value: WebDescription" />

Then the custom validation on the datasource iterates through the input elements and validates the above. Any way to skip having the extra html?

Thanks,
Matt

Validation

answered on 11 Dec 2017

1 answer

499 views

collapseRow for Grid group rows

Hi,

I'm working on collapse/expand functionality that can be applied to all of the grids across our application. I noticed a quirk of one 'expandRow' and 'collapseRow' functions offered with the Kendo grid. These functions can both expand and collapse groupings in the grid; however, the 'expandGroup' and 'collapseGroup' functions work only for groupings, but not for rows.

Do the functions that are group specific offer extra functionality over the row expand and collapse functions that makes the expand and collapse functionality different for groups in some cases? If so, what are these cases so I can know for the future?

Thanks,

Kevin

Grid

answered on 11 Dec 2017

1 answer

148 views

Cell Drag Fille (excel like)

Hi,

is there a way to do batch editing/drag fille of values in a grid.

I checked and see this feature is available in Kendo Excel component. Could it be provided in the grid as well?

Grid

answered on 11 Dec 2017

1 answer

300 views

Kendo Detail Grid Name

Hi Guys. i have use the Detail Template to achieve Master Detail Grid.

In order to give a name for the detail grid i have a error thrown by the system that is:-

"Uncaught Error: Syntax error, unrecognized expression: #ReassignedDtl_10000/1/12/2017/1"

I also find what is the error. the error is character "/"(slash).

but i want to set this name for the detail grid either with slash or without. because it was master grid's ID. it will change for each and every row.

Please help me with that. thanks in advance

Grid

answered on 11 Dec 2017

2 answers

155 views

[Solved] column menu fails on second try if columns has a ' field: "" '

Dear support

if there is a field: "" in the columns options the column menu will fail (not close or re-show) once shown on any of the other columns.

Please see this http://dojo.telerik.com/oJeqet

/Morten

Grid

answered on 11 Dec 2017

5 answers

905 views

Kendo grid Performance Issue

1. Kendo grid taken time to showing records (When Click button search and display records in Grid).
2 When select row by clicking on Kendo grid row it taken to much time to select row Why?

Grid

answered on 11 Dec 2017

2 answers

181 views

[Solved] When kendodraggable is enabled, the cell value can not be set on the grid

When kendodraggable is enabled, the cell value can not be set on the grid

http://dojo.telerik.com/eRaxeQ

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8"/>

<title>Kendo UI Snippet</title>

<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.common.min.css">

<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.rtl.min.css">

<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.silver.min.css"/>

<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.mobile.all.min.css">

<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>

<script src="https://kendo.cdn.telerik.com/2017.3.1026/js/kendo.all.min.js"></script>

<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.default.min.css">

<script src="https://kendo.cdn.telerik.com/2017.3.1026/js/angular.min.js"></script>

<script src="https://kendo.cdn.telerik.com/2017.3.1026/js/jszip.min.js"></script>

</head>

<body>

<div id="grid"/>

<script>

var data = [

{ id: 1, text: "text 1", position: 0 },

{ id: 2, text: "text 2", position: 1 },

{ id: 3, text: "text 3", position: 2 }

]

var dataSource = new kendo.data.DataSource({

data: data,

schema: {

model: {

id: "id",

fields: {

id: { type: "number" },

text: { type: "string" },

position: { type: "number" }

}

});

var grid = $("#grid").kendoGrid({

dataSource: dataSource,

sortable: true,

scrollable: false,

editable: true,

columns: ["id", "text", "position"]

}).data("kendoGrid");

grid.table.kendoDraggable({

filter: "tbody > tr",

group: "gridGroup",

threshold: 10011,

drag: function(e) {

$(e.target).closest("tbody").find("tr").css("background-color", "white");

$(e.target).closest("tr").css("background-color", "red");

},

hint: function(e) {

return $('<div class="k-grid k-widget"><table><tbody><tr>' + e.html() + '</tr></tbody></table></div>');

}

});

</script>

</body>

</html>

Grid

answered on 11 Dec 2017