Telerik Forums
Kendo UI for jQuery Forum
1 answer
383 views
Hi,

I'm getting no where with trying to get this to work.

I need to be able to fill a ScrollView widget with images after the click of a button or some other event - not on the load of the page. 

So, my user logs in and upon login verification the widget is shown and filled with the user's images. I can not get the widget to display any images. Right now I am using a local JSON object for data but there will be a remote call to get the JSON object. (I have confirmed the JSON object works if the dataSource and widget is set up and initialized on page load like the DataBinding example for the ScrollView.)

I need to hook up the following dataSource to a Scroll View on a button click and I need to be able to update the data source and the scroll view on another button click:

var _ds = new kendo.data.DataSource({
            data: mzData,
            serverPaging: true,
            pageSize: 36,
            schema: {
                data: "images.image",
                total: "images.count"
            }
        });
_ds.read();

Here's a sample of my JSON:

var mzData = {
    "images": {
        "count": 101,
       " image": [
            {
                "thumbnail": "http://core.windows.net/photos/thumbnails/a7ebe-ed83-464b-8666-08579d0f4/4fa8dce2-5532-49b0-aca7-2bfce063e6c9/26874/357742050405162-1383426800383.jpg",
                "width": 1024,
                "height": 768,
                uri: "http://core.windows.net/photos/a7ebe-ed83-464b-8666-08579d0f4/4fa8dce2-5532-49b0-aca7-2bfce063e6c9/26874/357742050405162-1383426800383.jpg"
            },
            {
               "thumbnail": "http://core.windows.net/photos/thumbnails/a7ebe-ed83-464b-8666-08579d0f4/4fa8dce2-5532-49b0-aca7-2bfce063e6c9/26874/357742050405162-1383426800383.jpg",
                "width": 1024,
                "height": 768,
                uri: "http://core.windows.net/photos/a7ebe-ed83-464b-8666-08579d0f4/4fa8dce2-5532-49b0-aca7-2bfce063e6c9/26874/357742050405162-1383426800383.jpg"
            }
        ]
    }
};

I have tried several different things including:

 var mz1 = $("#mzScrollView").data("kendoMobileScrollView");
        mz1.dataSource.data(_ds);

And
$("#mzScrollView").kendoMobileScrollView({ dataSource: _ds });
and
$("#mzScrollView").kendoMobileScrollView({ dataSource: _ds.data });

Nothing works.

Can you please tell me how to hook up a Scroll View widget to a remote data source and display the data on an event like a button click? Also, I need to know how to update the same widget with other remote data. For example, I will show images in the widget that are public and with the click of another button I will show images that are private.


Thanks.
Petyo
Telerik team
 answered on 27 Nov 2013
7 answers
448 views
How can I scroll a list view with endless-scrolling="true" to the top? I tried this:
app.view().scroller.reset();
and it works to a point. The view scrolls to the top, but the list appears to be empty and any inertia continues to scroll the page down.

I don't have access to the particular list element as I'm trying to apply a generic function that works on every view no matter if there is a list view or not.

Cheers
Dean
Petyo
Telerik team
 answered on 27 Nov 2013
1 answer
41 views
seems like the bookmarklet for themebuilder mobile is missing?
Kamen Bundev
Telerik team
 answered on 27 Nov 2013
3 answers
311 views
Here is my Model

model: {
id: "MSOrderNumber",
fields: {
     OrderNumber: { type: "number" },
    OrderDate: { type: "date" },
  },
},

The grid source's model is
public class Result
{
public string OrderNumber { get; set; }
public DateTime OrderDate { get; set; }
 }

The OrderNumber is bound properly but the OrderDate field shows up empty and also there is filter on this Date column, it should work on date filter.
Am I missing something here ? Any extra definition or anything like that required ?
Atanas Korchev
Telerik team
 answered on 27 Nov 2013
5 answers
489 views
I have a combox where the choices are driven by a remote datasource as follows:
input.kendoComboBox({
        dataTextField: 'label',
        dataValueField: 'id',
        dataSource: {
            type: "json",
            serverFiltering: true,
            transport: {
                read: {
                    url: 'api/getchoices,
                    data: {
                        filter: function(){
                                 return input.val();
                        }
                    }
                }
            }
        }
    });

The comboxbox is also bound to a view model
<input data-role="combobox" data-bind="value: id"/>
My problem is that when the page initially loads, the combobox shows the value of the id field and not the label that corresponds to that id.  This is not an issue if I use a local array as the datasource, but the remote datasource is filtered based on user input and not designed to look up label based on id.

In code (in the viewmodel actually) I have the value of the label corresponding to this id, and I would like it to appear when the form is loaded.

I was thinking to possibly append an additional item (current id/label) onto the datasource list of choices, but I also don't want to query the remote datasource unless the user interacts with the control.

What is a good way to have the combobox display the label when the page loads, but also not disturb the id value which is stored in the view model unless the user actually changes the control value?

Also, can anyone comment the use of input.val() to feed my remote query.  I do want to use the value that the user has typed in, but am wondering if combobox has some built-in alternative to using input.val().
Jayesh Goyani
Top achievements
Rank 2
 answered on 27 Nov 2013
3 answers
91 views
I know there's been quite a bit of discussion about IOS7 problems and content being obscured, but I couldn't find any help for my issue specifically.  I apologize if there is already forum on this...

I'm not looking for help with an app or phonegap, just want my mobile web app to display properly in Safari on IOS7.  My problem is with the footer, the bottom Safari toolbar is obscuring my content.  I've seen with other websites that the footer bar disappears when you scroll, but that doesn't happen with my Kendo app, scrolling up and down doesn't change anything - it's always blocking the bottom of my content.  Since this is a mobile website that isn't just for IOS7, I'm hoping to not have to add a margin to the bottom of my page.

Here's a couple screenshots to illustrate what I mean, this is when the user has scrolled all the way down to the bottom of the page.  There is a button at the very bottom that is hidden in behind the Safari toolbar that the user can't see or click on.

I read somewhere that Safari refuses to hide this bottom toolbar if the body height is set to 100%, which it looks like Kendo Mobile does. Trying to override the body height doesn't look like a good idea :-)

Anyone else run into this issue, or can point me at another blog or forum post with a solution?

Kevin Kembel
Top achievements
Rank 1
 answered on 26 Nov 2013
1 answer
113 views
ISSUE #1:

I tested and found you can not apply a badge with value of 0 (zero).
I can understand the original logic why - however it is problematic with dynamic updates of the value via jQuery.   Instead of it  disappearing it does nothing and leaves the old value.
<div id="foo" data-role="view">
  <a data-role="button" data-badge="1" data-click="resetClicks">Reset Badge Count</a>
</div>
 
<script>
var app = new kendo.mobile.Application();
 
function resetClicks() {
    this.badge(0); //set new badge value
}
</script>

You might consider adding another option flag:  data-badge-showzeros to handle all possibilites of user needs. Some may want to show Zero values and other not.
Kamen Bundev
Telerik team
 answered on 26 Nov 2013
1 answer
188 views
I dont need to see all events, I only need to ensure that I can set the height of an event template, to allow for say 2 lines of a title to show up. the current issue I am having is that I cant seem to add any CSS styling on top of my event to ensure that the event template renders using say height auto, or even just height: 45px

just a random number, but my point is still valid, I need to know how to expand the height of an individual event to at least show two lines.

attached is a screen shot from a project I am working on, as you can see the events are only one lined and cuts off the rest of the title.

suggestions?
James Hood
Top achievements
Rank 1
 answered on 26 Nov 2013
1 answer
100 views
Hi,

In the Q2 and Q3 release either flat or native Os when you add a checkbox to a listview and trying to tap it there's a huge delay for the checkbox to be checked or the other way around which is unchecked.

that wasn't their in Q1
Alexander Valchev
Telerik team
 answered on 26 Nov 2013
1 answer
195 views
Hi 

I have a treeview bound to a hierarchial data source from a database and use the requestEnd event to expand all nodes which works fine.

When I add a node via an ajax call it adds the data to the database correctly and I call dataSource.read()  to refresh the treeview as part of my ajax success function:
success: function () {
                      
                      foundItem = false;
                      $("#tree").data("kendoTreeView").dataSource.read();
                  }
 I then use the following code to find the item added (the unique name of which is stored in toSelectText) when the read function binds the tree, select it and display the details:
function onBound(e) {
            if (toSelectText != null && !foundItem) {
 
               var treeview = $("#tree").data("kendoTreeView");
               var selectitem = treeview.findByText(toSelectText);
 
               if (treeview.text(selectitem) == toSelectText) {
                   treeview.select(selectitem);
                   treeview.trigger("select", { node: selectitem });
                   foundItem = true;
               }
           }
 
       };
The foundItem variable is used because the call to this function is made many times as the read builds up the child data for each node.

For the first item that is added it works perfectly but for the second and subsequent items the dataSource.read() is not fired and the tree is not updated and the added item is not therefore selected.

Am I going about this the right way? Why would it work for the first item added but not subsequent items?

Many thanks in advance


Alexander Valchev
Telerik team
 answered on 26 Nov 2013
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
SPA
Filter
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
OrgChart
TextBox
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
Popover
DockManager
FloatingActionButton
TaskBoard
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
TimePicker
DateTimePicker
RadialGauge
ArcGauge
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?