Grid pageable?

10 posts, 0 answers
  1. Chris
    Chris avatar
    38 posts
    Member since:
    Feb 2012

    Posted 09 Mar 2012 Link to this post

    I've just delved into the new MVVM stuff, which is great as I'm used to working with Knockout and I love the concept. However, I'm setting data-sortable="true" to initialise a grid, but I can't see any way of actually setting whether the grid is pageable or not? I'd expect data-pageable="true" to work, however this is not the case...? Has anyone found any ways around this?
  2. Chris
    Chris avatar
    38 posts
    Member since:
    Feb 2012

    Posted 09 Mar 2012 Link to this post

    In fact, pageable *may* actually be working... it's potentially the record count that I'm having problems with sending through to Kendo grid for it to activate paging.

    I'm binding my data source with the dataSource.view() method in which is just sending my data through to the Grid and not picking up the total of my dataSource (I have { data: {}, total: xxx }) and obviously binding to data.view() and so the total isn't being recognised. I have a feeling I'm not doing this the correct way?
  3. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 14 Mar 2012 Link to this post

    Hello Chris,
    Actually data-pageable="true" is correct and it works but Kendo UI Q1'12 Beta MVVM does not support configuration of pageSize. In addition, I am glad to announce that in our official release at the end of the next week binding widgets to DataSource which is part of ViewModel will be available.
    As a possible workaround at the moment you could use query() to set pageSize.
    For example:
    $(document).ready(function() {
          var viewModel = kendo.observable({
            gridSource: [
             ...
             ],
             ...
        $("#grid").data("kendoGrid").dataSource.query({ page:1, pageSize:4});        
    });

    For more convenience I created a sample project and attached it.
    I hope this helps.

    Greetings,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  4. Chris
    Chris avatar
    38 posts
    Member since:
    Feb 2012

    Posted 14 Mar 2012 Link to this post

    Thank you Iliana for the demo project and amazing news about having the implementation available at the end of the week - very excited for this!
  5. Clinton Smyth
    Clinton Smyth avatar
    72 posts
    Member since:
    Apr 2007

    Posted 15 Mar 2012 Link to this post

    Hi

    I've run into a problem very similar to this.  In my case, however, I'm having problems getting newly created values into the viewModel.  I'm able to add empty rows to the viewModel but not populated.  This is because, from what I've seen, the viewModel is updated when the 'Add new record' event fires (ie. when the blank form appears which is before the user has entered the values).  Once the new values are entered, there is no event that updates the viewModel.

    Please could you extend your example attached to this thread, showing how create is handled.

    i.e. start with adding  data-toolbar='["create","save"]' to the <div  id="grid"...></div>

    and then add the code that allows populated rows to be shown in the modelView state on the right hand side.

    Thanks
  6. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 21 Mar 2012 Link to this post

    Hi Clinton,

    At this stage such functionality in the Kendo UI MVVM is not supported. It is in our ToDo list for future releases.
     

    Kind regards,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Clinton Smyth
    Clinton Smyth avatar
    72 posts
    Member since:
    Apr 2007

    Posted 21 Mar 2012 Link to this post

    Hi Iliana

    I'm sorry to hear that it's not yet supported - it's a rather big hole as all the other editing (deletes and edits) in the table work really well.  Is there a suggested work around in the meantime?  Perhaps a way to trigger off the 'save update' event and manually populate the viewModel??
  8. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 23 Mar 2012 Link to this post

    Hello Clinton,

    I am glad to announce that in the latest version of Kendo UI it is possible to create new data in the Grid, update and delete it. You could achieve such functionality using the following code snippet:
    <div id="grid"
        data-role="grid"
        data-editable= "inline"
        data-source='{"schema": {"model": {"fields": {"Field1": "Field1", "Field2": "Field2}}}}'
        data-columns='["Field1", "Field2", {"command": ["destroy", "edit"]}]'
        data-bind="source: gridSource"
        data-toolbar='["create"]'>
    </div>

    For convenience I attached a sample project.


    Greetings,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Clinton Smyth
    Clinton Smyth avatar
    72 posts
    Member since:
    Apr 2007

    Posted 27 Mar 2012 Link to this post

    Wonderful - it's working now.  I would mark this as answered but I don't see the link!
  10. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 28 Mar 2012 Link to this post

    Hi Clinton,

     The "mark as answer" button is only visible to the user who started the forum thread.

    All the best,
    Atanas Korchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top