Questions on Kendo UI for jQuery Forum

4 answers

378 views

How can group items in ListView based on their first character

Hi

I am doing some tests with Kendo UI Mobile for an upcoming project. One thing that I saw can be easily done in jQuery Mobile's ListView is to group items in the ListView by their first character (like contacts in iPhone) automatically and even add a Search box on the top just by setting a property.
I was trying to do the same thing with Kendo UI using a DataSource loading json data from a data service. I can see the list of items in the ListView but I am not able to group them by their first character.
All the examples I have seen use a separate data field for group but I do not have a field for the first character.
Is there anyway that I can group list of names by the first character or at least create an unbound field in the datasource's model/shema that returns first character of the item so I can use it for groping?

Also is there an example that shows how to use a Search field to filter the ListView data?

I appreciate your help in advance.

Regards
Ron Farko

ListView (Mobile)

answered on 25 Jan 2013

1 answer

416 views

Refresh/Update list-item template?

Hi,

I have the following scenario:

A listview
A modalview to edit listview item

Once the listview-item is edited, I would like to close the modalview and update/refresh ONLY the listview-item that was impacted.

Is this possible? If yes, how can I achieve this? I want to avoid to refresh all the listview because the scroll position would be lost :-S.

Thanks for your support.
myTeamWorks

ListView (Mobile)

answered on 25 Jan 2013

3 answers

766 views

Open numeric keypad on mobile device?

Is there a way to load the numeric keypad when clicking in the box instead of the full keyboard? Thank you.

NumericTextBox

answered on 25 Jan 2013

3 answers

918 views

Turn off date/time autocomplete

Hi,

Is there a way we could add "autocomplete=off" to the date and time input fields? We simply don't want the field to be auto-completed using previously entered values.

Thanks

DatePicker

answered on 25 Jan 2013

4 answers

81 views

PullToRefresh argument undefined

Hi,

I've a problem with the 'pullToRefresh' feature of the mobile listview.

$("#posts").kendoMobileListView({

pageSize: configPageSize,

dataSource: ds,

template: kendo.template($("#tmpl-post").html(), {useWithBlock:true}),

endlessScroll: true,

scrollTreshold: 30, //treshold in pixels

appendOnRefresh: true,

pullToRefresh: true,

pullParameters: function(item) {

//additional parameters

return {

since: item.CreatedOn,

page: 1

};

},

click: function(e) {

//writeLog($(e.target).closest('li').attr('id'));

}

});

'item' parameter of pullParameters function is UNDEFINED. Why is this happening? Am I doing something wrong?

Thanks for help.
Bastien

ListView (Mobile)

answered on 25 Jan 2013

1 answer

157 views

Scrollview within a part of the content of a page

Is there a way to have a scrollview that is only a portion of the content (not within the data-role=header/footer) of the view, and the rest of the view content being something else?

Assume that I have two portions within my view:

<div id="id1">....</div>
<div id="id2"></div>

and I set (in code) id2 to be a kendoScrollView, it seems that the scroll-view wrapper that kendo creates, includes id1 within it as well, but I only want id2.

Is this possible?

ScrollView (Mobile)

answered on 25 Jan 2013

1 answer

138 views

Modalview + Textarea + Keyboard open/close (bug?)

Hi,

I've a very strange behavior trying to close the keyboard when closing a modalview.

My modalview is like this:

<div id="modalview-create-post" data-role="modalview" style="width:100%;height:100%;" data-open="showCreateNewPost" data-init="initCreateNewPost">

<div id="modalview-post-content">

<div>

<a id="new-post-cancel" data-click="closeCreateNewPost" data-role="button">Cancel</a>

<a id="new-post" data-click="createPost" data-role="button">Post</a>

<span id="new-post-count"></span>

</div>

<textarea id="new-post-txt" class="watermark" counterSelector="#new-post-count" ></textarea>

</div>

function closeCreateNewPost() {

forceBlurTextarea($('#new-post-txt'));

$('#modalview-create-post').data('kendoMobileModalView').close();

}

function forceBlurTextarea(textarea) {

    $(textarea).val($(textarea).text());

    var cssClass = $(textarea).attr('class');

    $(textarea).attr('class', cssClass.replace("unwatermark", "watermark"));

}

As you can see, my modalview contains a textarea and a cancel button to close the modalview. The cancel button is not at the same HTML-DOM level as the textarea.

The first time I open the modalview, click inside the textarea (to make the keyboard appear) and then click on cancel to close the modalview, all is going well => modalview closes, keyboard automatically disappear

The 2nd time I do this, the modalview also closes BUT the keyboard stays visible!

Now if I put the 'cancel' button JUST AFTER the textarea (at the same HTML-DOM level as the textarea), it's working every time.

Do you have an explanation on why this is happening?

By the way, does it give a function to programmatically open/close the keyboard?

Thanks for your support.
Bastien

ModalView

answered on 25 Jan 2013

1 answer

102 views

Chekbox in grid editable row

Hi,

I have a GridView which is populated from the database.
Each row in the GridView can be edited.

One column in the GridView bound to boolean (bit) filed ("IsEnabled").
When Grid row is in edit mode this "IsEnabled" filed is changed to checkbox.

I would like the change checkbox with image (two images, one for checked state, another for the unchecked state).
Is that possible and how to do it?

Tnx,
Siam

Grid

answered on 25 Jan 2013

4 answers

226 views

Jquery 1.7.2 compatibility

Is there any information about Jquery 1.7.2 compatibility?
Can we move to this release safely?

General Discussions

answered on 25 Jan 2013

12 answers

780 views

Can't drag column headers to group by

I've created a grid with Ajax datasource and set 'Groupable()', but when I try to group by the first column (a text field), the field has the circle with a cross icon (not allowed) and can't be dropped in the 'Drag a column header here....' area.

I have also set grouping to default to the first columns, which works, but if I remove that grouping (by clicking on the close icon for the column header), grouping is cancelled and I can't drag it back.

Grid

answered on 24 Jan 2013