Questions on Kendo UI for jQuery Forum

20 answers

1.5K+ views

[Solved] Grid inside of grid reading child array of data

Hi folks!
I have a grid, where a td in the table row contains both various dataItems and a grid, for displaying a hierarchical array (parts) of data:

{

"telephone":"4215278204",

"parts": [

{

"partNumber":95412335,

"partName":"Widget 1"

},

{

"partNumber":95417256,

"partName":"Widget 2"

},

{

"partNumber":12655026,

"partName":"Widget 3"

},

{

"partNumber":12638611,

"partName":"Widget 4"

}

],

"supplierCompany":"ACME, INC.",

"supplierLocation":"Austin, TX",

"description":"Goods, etc.."

},

How can I read that 'parts" array in my embedded grid?

Grid

answered on 10 Apr 2015

4 answers

873 views

How to give borders to table.

Hi,

I am able to insert tables inside the Editor using the "Create table" button.

However, I am not able to format the table (like giving border to the table and setting width etc.)

Is there any solution to this problem.

Thanks,
Pavan

Editor

answered on 10 Apr 2015

1 answer

115 views

Calling Create New Row Editor Template from a button in Grid

How I can call create new row editor template in popup from a button outside a Grid instead of calling the default button in Toolbar

ToolBar(toolBar => { toolBar.Create(); })

Thanks

Grid

answered on 10 Apr 2015

7 answers

855 views

Invalid value for <path> attribute d=

Hi,

i cant show any chart in my app, ive got an error:
Invalid value for <path> attribute d="M5 43 L NaN 43 NaN 361 5 361Z"

but its working in your dojo http://dojo.telerik.com/EnIYE

$("#chart").kendoChart({

title: {

text: "test chart"

},

legend: {

position: "bottom"

},

seriesDefaults: {

type: "area",

area: {

line: {

style: "smooth"

}

},

series: [{

name: "Licznik 1",

data: [7, 12, 11, 13, 13, 17, 16, 15, 17, 10, 5, 5, 4]

}, {

name: "Licznik 2",

data: [17, 26, 30, 31, 31, 27, 24, 33, 30, 19, 16, 16, 12]

}, {

name: "Licznik 3",

data: [3, 3, 5, 6, 6, 5, 5, 6, 6, 5, 3, 3, 1]

}, {

name: "Licznik 4",

data: [7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7]

}],

valueAxis: {

labels: {

format: "{0} kwh"

},

line: {

visible: false

},

axisCrossingValue: -10

},

categoryAxis: {

categories: ["08:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00", "15:00", "16:00", "17:00", "18:00", "19:00", "20:00"],

majorGridLines: {

visible: false

}

},

tooltip: {

visible: true,

format: "{0} kwh",

template: "#= series.name #: #= value #"

}

});

Charts

answered on 09 Apr 2015

1 answer

262 views

[Solved] Tooltip at top of chart div

My Kendo Chart is located within a div. That div currently has a title tag on it. The issue is that the tooltip for that title tag shows on mouse hover over the div area, but it is interfering with the chart tooltip (e.g. pie chart tooltip for a pie piece). It is not possible for me to remove the title attribute from the enclosing div because of 508/WCAG requirements. I'm hoping I can use Kendo's Tooltip widget to always show the tooltip at the top of the div, regardless of where the mouse is located within the div. If so, please provide the API usage to make this possible.

Thanks,

--Ed

ToolTip

answered on 09 Apr 2015

3 answers

90 views

[Solved] Charts in grid rows are not exported to PDF

I am using Kendo UI v2015.1.318 and trying to export kendoGrid to PDF. This grif contains charts (sparklines) in each row. When I export it to PDF - charts are not rendered for some reasons. This is the modified DEMO I adjusted to demonstrate the issue - http://dojo.telerik.com/@dimaka/OjAPE You can see charts in odd rows instead of photos (as was in the original demo) To reproduce the issue - click on EXPORT TO PDF and open the PDF file.

How can I make these charts to be exported to PDF file?

Looking forward to your advice. Thank you in advance!

Charts

answered on 09 Apr 2015

3 answers

371 views

Extend base widget "kendo.ui.Widget"

Hello,

Is it possible to extend the base widget "kendo.ui.Widget" ?

I tried the following, but it doesn't work:

var ExtendedWidget = kendo.ui.Widget.extend({

init: function (element, options) {

kendo.ui.Widget.fn.init.call(this, element, options);

if (options.componentContainer != null)

{

options.componentContainer.push(this);

}

},

options: {

name: "Widget",

componentContainer: undefined

},

});

kendo.ui.plugin(ExtendedWidget);

Kind Regards,

Marco

General Discussions

answered on 09 Apr 2015

3 answers

292 views

[Solved] Kendo Drawer Overlay animation

Is there any way to make the drawer show a diferent animation?
I need the drawer to be shown as am Overlay not a Push content panel.
I found that jquery mobile is doing that, but my project is now is using kendo so we canot change and we understand they are not compatible (kendo and JQMobile).
Can we make it show as Overlay?

Ex. http://demos.jquerymobile.com/1.4.5/panel/

Drawer (Mobile)

answered on 09 Apr 2015

1 answer

93 views

Virtual scrolling issue with kendo Grid

Hi All,

I tried virtual scrolling with kendo Grid. Client is complaining about scrolling effect is not smooth(horizontal and vertical scrolling) in Mobile devices(Android and IOS). So can you please help me how can i solve this issue with kendo grid.

Thanks,

Nirav

Grid

answered on 09 Apr 2015

5 answers

445 views

How to apply horizontal scroll bar to kendoMobileListView ?

Hi All,

I am trying add horizontal scroll bar inside kendomobileListview (with endless scrolling). But i am not able find any solution.

HTML Code:-

<div class="mobileListViewWrap deskNone">

<div id="siteVisitationEndlessScroll" class="mobileListView k-grid gridBrdr mobInfGrid">

<div id="siteVisitationEndlessScrollView" data-role="view" data-title="Company | Date | Reimbursement | Head Offices ">

<div data-role="header" class="mobileListViewHeader" >

<div data-role="navbar" >

<div class="wdth200px"><a class="k-link" href="#">Company</a></div>

<div class="wdth100px"><a class="k-link" href="#">Visit Date</a></div>

<div class="wdth160px"><a class="k-link" href="#">Reimbursement</a></div>

<div class="wdth160px"><a class="k-link" href="#">Head/Admin Offices</a></div>

</div>

<ul id="siteVisitationViewformobile" class="mobileListViewList"></ul>

<div id="noItemsToDisply">No items to display</div>

</div

</div>

<script type="text/x-kendo-tmpl" id="siteVisitationTemplate">

<div class="fLeft wdth200px">#:CompanyName#</div>

<div class="fLeft wdth100px">#:getDateInCurrentTimezone(VisitDate)#</div>

<div class="fLeft wdth160px"></div>

<br><br>

</script>

Javascript :-

var app = new kendo.mobile.Application($("#siteVisitationEndlessScroll"));

Javascript code for Bind :-

$("#siteVisitationViewformobile").kendoMobileListView

({

dataSource: dataSource,

template: $("#siteVisitationTemplate").html(),

endlessScroll: true

});

I am able to workaround horizontal scroll bar with data-stretch="true" but it disables the scrolling. I want to implement mobileListView with Endless Scrolling. Please help me regarding this.

Thanks,
Nirav

ListView (Mobile)

answered on 09 Apr 2015