Questions on Kendo UI for jQuery Forum

3 answers

127 views

[Solved] Formatting grid in combination with localization

I have set the culture to 'nl-BE' which should display currencies in the '€ 12,34' format. It doesn't however...

Found that applying a row template caused this behaviour. Worked with column template instead and everything works just fine now.

Grid

answered on 15 Jan 2013

2 answers

434 views

[Solved] Formatting the footer of a grid that uses row templates

How can one format the footer of a grid that uses aggregates? I would like to align text to the right and give the text another color. The correct localization should also be applied.

Found solution by extending the css class .k-footer-template
Regards

Grid

answered on 15 Jan 2013

5 answers

1.4K+ views

[Solved] dataSource.query

Hello

I have next code:

var dataSource;

function newsListInit() {

dataSource = new kendo.data.DataSource({

pageSize: 12,

serverPaging: true,

// ... //

});

$("#newsList").kendoMobileListView({

dataSource: dataSource,

template: $("#newsList-template").text(),

endlessScroll: true,

scrollTreshold: 30

});

}

I want to use dataSource var from another view and declared it in global scope. When I use the query method (like so):

dataSource.query({take:12, skip:12});

the AJAX call runs, but in console I get the error:

Uncaught TypeError: Cannot read property '0' of undefined kendo.mobile.min.js:14
    f.extend.refreshkendo.mobile.min.js:14
p.isFunction.fjquery.min.js:2
Class.extend.triggerkendo.mobile.min.js:9
j.extend._processkendo.mobile.min.js:11
j.extend.successkendo.mobile.min.js:11
p.isFunction.fjquery.min.js:2
n.successkendo.mobile.min.js:11
kjquery.min.js:2
l.fireWithjquery.min.js:2
yjquery.min.js:2
c.onload.c.onreadystatechangejquery.min.js:2

    

Does it possible to use dataSource in this way and how to do it right?

Data Source

answered on 15 Jan 2013

3 answers

161 views

CascadeFrom and optionLabel

Consider two comboboxes. Box1 and Box2:
- Box2 is cascading from Box1
- Box1 has an optionLabel

It appears to me that Box1 is populating (or attempting to populate) Box2 when the Box1 optionLabel is selected.

This is erroneous. When Box1 optionLabel gets selected Box2 should be emptied and deactivated.

DropDownList

answered on 15 Jan 2013

1 answer

183 views

TimePicker error in IE8

Hi there,

I'm getting the following error from IE8 when trying to define two Timepickers within a Grid's edit popup window:-

"Object doesn't support this property or method"

The result of this is my change event isn't executing and I can no longer submit the update. The bottom button stops working.

The code I'm using currently looks like this :-

function editTimeSheet(e) {

e.container.find('#projectDrpDwn').kendoDropDownList({

autoBind: false,

dataSource: dsn.projects

});

e.container.find('#WorkDate'

).kendoDatePicker();



      // *** ERRROR OCCURS AFTER THIS LINE IN IE8 ONLY***

startTime = e.container.find('#startTime').kendoTimePicker().data('kendoTimePicker');

endTime = e.container.find('#endTime').kendoTimePicker().data('kendoTimePicker');

// attach change event handler via bind()

startTime.bind('change', startTimeChange);

// Define min/max range

startTime.min('07:00');

startTime.max('20:00');

endTime.min('07:00');

endTime.max('06:30');

}

The template (remotely called in) looks like this:-

<script type="text/x-kendo-template" id="timesheetTemplate">

<div class="k-edit-label">

<label for="Project">Project</label>

</div>

<div data-container-for="Project" class="k-edit-field">

<input id="projectDrpDwn" name="Project" data-text-field="ProjectName" data-value-field="Id" data-bind="value:Project" style="width: 100%;" required validationMessage="Project is required" />

<span class="k-invalid-msg" data-for="Project"></span>

</div>

<div class="k-edit-label">

<label for="WorkDate">Work Date</label>

</div>

<div data-container-for="WorkDate" class="k-edit-field">

<input id="WorkDate" name="WorkDate" data-type="date" data-format="dd/MM/yyyy" data-bind="value:WorkDate" required validationMessage="Work Date is required" />

<span class="k-invalid-msg" data-for="WorkDate"></span>

</div>

<div class="k-edit-label">

<label for="startTime">Start Time</label>

</div>

<div data-container-for="StartTime" class="k-edit-field" style="width:132px">

<input id="startTime" name="StartTime" data-format="HH:mm" data-bind="value:StartTime" data-role="timepicker" required validationMessage="A start time is required" />

<span class="k-invalid-msg" data-for="StartTime"></span>

</div>

<div class="k-edit-label">

<label for="endTime">End Time</label>

</div>

<div data-container-for="EndTime" class="k-edit-field" style="width:132px">

<input id="endTime" name="EndTime" data-format="HH:mm" data-bind="value:EndTime" data-role="timepicker" required validationMessage="An end time is required" />

<span class="k-invalid-msg" data-for="EndTime"></span>

</div>

I've tried a combination of things, syntax changes but nothing seems to remove the error.

IE9 compatibility mode shows the same issue but in normal and other browsers (FF, Chrome, Safari) no problems.

Kendo UI version is v2012.3.1114

Thanks

DatePicker

answered on 15 Jan 2013

1 answer

302 views

Three or more DropDownList linked by cascadeFrom

The page http://docs.kendoui.com/getting-started/web/combobox/cascading has some great FAQ.

One entry is related to work I am doing:
"Q: I am using comboboxes with load on demand (autoBind: false) and I need to pre-set the selected items."

However, the question I have is to related multiple cascades

$("#level1").kendoDropDownList ({ ... });
$("#level2").kendoDropDownList ({ ... cascadeFrom: "level1" ...});
$("#level3").kendoDropDownList ({ ... cascadeFrom: "level2" ...});

Is there a fiddle or example show cascadeFrom working with 2 or more linkages ?
Is the cascading system developed to handle multi-level cascades in the proper serial manner so as to arrive at the states of the following four actions?

Action
1.
level1 optionLabel selected
-> level2 & 3 disabled & emptied,
-> level2 & 3 optionLabel displayed

2.
level1 selected
-> level2 queried using level1
-> level3 disabled & emptied
-> level2 & 3 optionLabel displayed

3.
level2 optionLabel selected
-> level3 disabled & emptied
-> level3 optionLabel displayed

4.
level2 selected
-> level3 queried using level2
-> level3 optionLabel selected

Thanks,
Richard

DropDownList

answered on 15 Jan 2013

1 answer

134 views

the bug on the demo page?

On the page http://demos.kendoui.com/mobile/scrollview/index.html the scroll view should display the third page (data-page="2"):

<div data-role="scrollview" data-page="2">

The pager displays the right page, but the scroller stays on the first photo after initialization.

ScrollView (Mobile)

answered on 15 Jan 2013

2 answers

250 views

what configuration properties keep column header visible while content rows scroll?

In the grid shown here:

http://www.kendoui.com/web.aspx

what combination of configuration settings causes the column header to stay in place while the content-rows scroll? Is a footer required to obtain that behavior?

Grid

answered on 15 Jan 2013

1 answer

214 views

BarChart with XAxis Labels with Images

In my ASP. Net MVC App, I would like to add Bar Chart with X Axis labels as images.

Ex: Category wise Sales Chart I want to display is Category as a Image in place of text.

Is this possible in Chart API?. If possible could you please share details.

Charts

answered on 15 Jan 2013

1 answer

77 views

[Solved] Testing for non-supported devices and browsers

I am developing only for mobile devices, but allowing my clients a preview apps in web environment. I'd like to allow web-access to supported mobile devices (iOS and Android in my case), but not to other devices or desktop browsers. How and where should I implement this feature in a Kendo Mobile application, thanks!

General Discussions

answered on 15 Jan 2013