During try the new version 2023.1.425 mobile listview component, when we binding data and used the template, we found the prompt data [0].
uid is undefined, The old version did not find this problem, the new version of this problem, I do not know why.
see the link
https://dojo.telerik.com/?_gl=1*dxcc66*_ga*MTQyMzc3MjYyLjE2NzgwNzg5MjA.*_ga_9JSNBCSF54*MTY4NjA5NjI4NC4xMC4xLjE2ODYwOTYzMTguMjYuMC4w
Hi
i use Kendo Mobile Tabstrip It doesn't show me any results
result for me
This problem also exists in other kendo mobile controls
pls help me
thank you
Dear Team,
I have problem with kendo scheduler agenda view in mobile devices. End time in k-scheduler-timecolumn shows incorrect value (it equals to Start time value). Could you please answer how can I fix it?
Hello support,
We are looking for documentation about this demo:
https://demos.telerik.com/kendo-ui/m/index?&_ga=2.87831967.627147470.1612949974-420973595.1604377799#mobile-listview/hierarchical-databinding
And more specific about how to use: hierarchical-listview.
Please let us know if any questions.
Kind regards,
Roel Alblas
Hello everybody,
ref: Kendo Mobile Listview (Scroller): visibleScrollHints
Is it somehow possible to change the visibility of the y-scrollbar at runtime?
Thanks for your help
axel
I've been chasing down an elusive problem for some time now and I've narrowed it to a logic change in the ListViewItemBinder.refresh() method between Kendo UI versions 2015.2.902 and 2015.3.930 (the issue happens on every version since 2015.3.930). We have a mobile list view that is bound to a data source. The template for the ListView creates a Touch widget and a tap handler for each list item. The tap events and event handlers are working just fine, within this tap handler we change several properties on the data items within the DataSource. The issue is that in v2015.2.902 these property changes cause the ListView to refresh itself and properly reflect those property changes, but in 2015.3.930 the ListView does *not* refresh itself even though the code has not changed on our end.
I finally managed to isolate the issue to a logic change within ListViewItemBinder.refresh() between the two versions, specifically within the first "if" block. Here's the logic in 2015.2.902:
if
(action ===
"itemchange"
&& !listView._hasBindingTarget()) {
item = listView.findByDataItem(dataItems)[0];
if
(item) {
listView.setDataItem(item, dataItems[0]);
}
return
;
}
In 2015.2.902, action === "itemchange" resolves to true and !listView._hasBindingTarget()) resolves to false, so this block is skipped. The code eventually drops to the following if/else if/else blocks and eventually calls the very last "else" block which actually triggers the kendo code that re-executes the template and replaces the HTML content (comment is mine):
if
(action ===
"add"
&& !groupedMode) {
var
index = view.indexOf(dataItems[0]);
if
(index > -1) {
addedItems = listView.insertAt(dataItems, index);
addedDataItems = dataItems;
}
}
else
if
(action ===
"remove"
&& !groupedMode) {
addedItems = [];
listView.remove(dataItems);
}
else
if
(groupedMode) {
listView.replaceGrouped(view);
}
else
if
(prependOnRefresh && !listView._filter) {
addedItems = listView.prepend(view);
addedDataItems = view;
}
else
{
listView.replace(view);
// <-- This is where the template is re-executed
}
However, in v2015.3.930, the first "if" block I listed earlier was re-written as follows:
if
(action ===
"itemchange"
) {
// action is indeed "itemchange"
if
(!listView._hasBindingTarget()) {
// This evaluates to false
item = listView.findByDataItem(dataItems)[0];
if
(item) {
listView.setDataItem(item, dataItems[0]);
}
}
return
;
// We hit this return statement, thus the "refresh" block is never called
}
As I mentioned in the comments, this logic change causes us to immediately hit the "return" statement and we never drop into the lower if/else if/else block where the template gets re-executed. My questions then are as follows:
I've tried to mock up this scenario in the Dojo but as of yet haven't quite been able to do it, hence the long post. Thanks for taking a look!
Hi,
we have been building an SPA using Vue2 that also will be serves as mobile application (wrapped using Cordova). we need Grouped list item with fixed group header (exactly the same functionality as Mobile Listview - Fixed Header). AFAIK i cannot achieve that using Kendo Listview Vue Wrapper.
is it possible to use Kendo Mobile UI especially Mobile ListView inside of Vue application, because i cannot find any reference about this in telerik documentation & the forum.
Thought I'd post this for anyone who has a similar issue. And also for kendo staff to see and fix (if it is indeed a bug).
Note: all references to input are in regard to type=checkbox and type=radio, not text input areas
I was adding input boxes to a mobile listview and found that if any tag is added outside of the label tag holding the input, the input doesn't work. It also appears that an input without a label container doesn't seem to function properly either. Whereas a input defined inside a label inside a mobile listview will have extra classes and an ::after appended to it, none of these show up in the case noted in the first sentence of this paragraph. I finally got it to work with a workaround after observing "correctly working" inputs and what kendo injects into the html for those items.
IT policy at my work prevents me from creating a code snippet, so I pasted the code below, which is a modified version of http://demos.telerik.com/kendo-ui/m/index#popover/index:
<!DOCTYPE html>
<
html
>
<
head
>
<
base
href
=
"http://demos.telerik.com/kendo-ui/m/index"
>
<
style
>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</
style
>
<
title
></
title
>
<
link
rel
=
"stylesheet"
href
=
"https://kendo.cdn.telerik.com/2017.2.504/styles/kendo.common-material.min.css"
/>
<
link
rel
=
"stylesheet"
href
=
"https://kendo.cdn.telerik.com/2017.2.504/styles/kendo.default.min.css"
/>
<
link
rel
=
"stylesheet"
href
=
"https://kendo.cdn.telerik.com/2017.2.504/styles/kendo.mobile.all.min.css"
/>
<
script
src
=
"https://kendo.cdn.telerik.com/2017.2.504/js/jquery.min.js"
></
script
>
<
script
src
=
"https://kendo.cdn.telerik.com/2017.2.504/js/kendo.all.min.js"
></
script
>
</
head
>
<
body
>
<
div
data-role
=
"view"
data-title
=
"Tag this photo"
id
=
"popover"
data-use-native-scrolling
=
"true"
>
<
div
data-role
=
"header"
>
<
div
data-role
=
"navbar"
>
<
a
id
=
"back-button"
class
=
"nav-button"
data-align
=
"left"
data-role
=
"backbutton"
>Back</
a
>
<
span
data-role
=
"view-title"
></
span
>
<
a
data-align
=
"right"
data-rel
=
"popover"
href
=
"#popover-people"
data-role
=
"button"
data-icon
=
"contacts"
></
a
>
<
a
data-align
=
"right"
data-icon
=
"source-code"
data-click
=
"goToSourceCode"
data-role
=
"button"
title
=
"Show this demo source code"
></
a
>
</
div
>
</
div
>
<
div
data-role
=
"content"
style
=
"text-align: center;"
>
<
img
src
=
"../content/mobile/shared/faces.jpg"
/>
</
div
>
<
div
data-role
=
"popover"
id
=
"popover-people"
data-popup
=
'{"height": "20em", "width": "20em"}'
>
<
div
data-role
=
"view"
data-title
=
"People"
>
<
div
data-role
=
"header"
>
<
div
data-role
=
"navbar"
class
=
"km-light"
>
<
span
data-role
=
"view-title"
></
span
>
<
a
data-role
=
"button"
data-align
=
"right"
data-click
=
"closeParentPopover"
data-icon
=
"close"
></
a
>
</
div
>
</
div
>
<
ul
data-role
=
"listview"
data-click
=
"clickit"
>
<
li
><
label
>Isabella Anderson<
input
type
=
"checkbox"
checked
=
"checked"
class
=
"km-widget km-icon km-check"
></
label
><
span
>Test</
span
></
li
>
<
li
><
input
type
=
"checkbox"
checked
=
"checked"
></
li
>
<
li
><
label
>Linda Anderson<
input
type
=
"checkbox"
></
label
></
li
>
<
li
><
label
>Oliver Anderson<
input
type
=
"checkbox"
></
label
><
a
></
a
></
li
>
<
li
><
div
></
div
><
label
>James Williams<
input
type
=
"checkbox"
></
label
></
li
>
<
li
><
label
>Barbara Williams<
input
type
=
"checkbox"
></
label
></
li
>
</
ul
>
</
div
>
</
div
>
<
div
data-role
=
"popover"
id
=
"popover-location"
data-popup
=
'{"width": "20em"}'
>
<
div
data-role
=
"view"
>
<
ul
data-role
=
"listview"
data-click
=
"clickit"
>
<
li
><
label
>Sydney, Australia <
input
name
=
"location"
type
=
"radio"
></
label
></
li
>
<
li
>New York, USA <
input
name
=
"location"
type
=
"radio"
></
li
>
<
li
><
input
name
=
"location"
type
=
"radio"
><
div
>Test</
div
></
li
>
</
ul
>
</
div
>
</
div
>
<
div
data-role
=
"footer"
>
<
div
data-role
=
"navbar"
>
<
a
data-align
=
"right"
href
=
"#popover-location"
data-rel
=
"popover"
data-role
=
"button"
>Location</
a
>
</
div
>
</
div
>
</
div
>
<
script
>
function clickit(e) {
console.log(e.item.find('input').prop('checked'));
}
</
script
>
<
script
>
var app = new kendo.mobile.Application(document.body, { skin: "nova" });
</
script
>
</
body
>
</
html
>
Note the modified lines in the listviews where I remove labels in a few of them and in others I add random html tags before and after the </label>. It didn't matter if they were empty or had content in them.
I also tried modifying the 'checked="checked"' values via jQuery and also through data-binding with a ternary operator like one of your admins showed in this forum thread: http://www.telerik.com/forums/dynamically-creating-checkbox-listview-doesn-t-allow-selecting. While the value shows to be checked, and a $(elem).prop('checked') will return true/false correctly, the box doesn't show the checkbox when 'checked="checked"' is present in the input element (see the 'clickit' function and 2nd item of listview with checkboxes in the code snippet).
The thing that finally worked was to use jQuery to set the $(elem).prop('checked', true/false) ANDmanually add the classes I note were added automatically to inputs that 'work properly' : km-widget km-icon km-check. Note the very first listview item with checkboxes in the code snippet.
Now the question for staff: Why doesn't kendo automatically add these classes to listview inputs except in cases where it's <label>TEXT<input type="radio/checkbox" /></label> ? Is this a bug? Or if it's intended, why? In more complicated templates, such as the one in my code, it requires workarounds with setting the listview's data-click AND adding those three above classes to all my inputs if they're not exactly in a format that "works" (it also seems all kendo examples of inputs in listviews follow that exact formatting, which leads me to assume this issue is known...just uncommonly crossed upon by users). It's not a big deal once I figured it out, but the time spent wondering what was wrong and stepping through my code and all the possibilities was time consuming.
Or am I just doing things in the most horribly wrong way?
P.S. Out of curiosity, why was there a need to override/prevent the default behavior of the checkbox and radio inputs? Just for aesthetic purposes?