Questions on Kendo UI for jQuery Forum

1 answer

192 views

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

312 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

140 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

260 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

217 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

92 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

1 answer

118 views

Dataviz and kendo mobile scroll

Hi , i'm not sure where to post that question hence I started it here.

I have implemented kendo mobile with a dataviz pie graph and a donut graph chart, my issue is i cannot scroll down by tapping or pressing over the SVG chart i can only scroll down the mobile page if i press outside the chart or in the content area of the mobile page.
So in my case if its a chart that takes from side to side and uses the whole page width i will not be able to scroll at all down.
Can you help please?

General Discussions

answered on 15 Jan 2013

1 answer

201 views

[Solved] Formatting lost when applying template for second time

The kendo UI formatting gets lost when the same screen / template gets displayed for a second time.

On the first visit, the screen (attachment screenshot-1.png) shows the listview nicely formatted.

Then, the user clicks on the "Back" button and then redisplays the screen. The second time, the same screen shows with all formating stripped out (attached screenshot-2.png). When looking at the DOM tree, several wrapped kendo DIV elements are missing - like the ones with class km-scroll-container and km-listview-wrapper.

Any help greatly appreciated. A standalone test HTML page is also attached. Very easy to reproduce: just click on "View jail cards", go back, and click "View jail cards" again.

Here is the snippet that applies the template and navigates to that screen:

var templateContent = $("#tmpl_jailcard"

).html();

var

template = kendo.template(templateContent);

$(

"#scr_jailcard"

).html(template(data));

app.navigate(

"#scr_jailcard");<br>

Another way to reproduce the error is to apply the templating and navigation twice, like this:

var templateContent = $("#tmpl_jailcard"

).html();

var

template = kendo.template(templateContent);

$(

"#scr_jailcard"

).html(template(data));

app.navigate(

"#scr_jailcard"

);



// The following simulates the problem by re-applying template and navigating to it

$("#scr_jailcard").html(template(data));

app.navigate("#scr_jailcard");

General Discussions

answered on 15 Jan 2013

1 answer

171 views

Custom TimePicker

I am trying to use the TimePicker with and interval of 1 minute. However the ui is rather tedious when the interval is set that low. Is it possible to get the control to support multiple drop downs? ie one drop down for each segement: hour, minute, and AM/PM?

DatePicker

answered on 15 Jan 2013

4 answers

316 views

Touch + Input + Focus = Keyboard open and then close

Do I need to use a timeout function on the tap event of the touch widget? I have a touch image that is bound to the tap event that draws focus on the input. However, the keyboard opens and then automatically closes.

$plugin.closest('span').append('<img src ="srb-images/srb-delete.png" class="bar">').find('img').kendoTouch({ tap: function(e) {

console.log(e.touch.target.attr('class') + " was tapped");

e.touch.target.prev().focus();

}

});

On the other hand, if I hold the touch for a period of time, the keyboard stays open.

~ richard

iOS simulator

General Discussions