Toggle Button In first Column

5 posts, 1 answers
  1. Dr.YSG
    Dr.YSG avatar
    210 posts
    Member since:
    Dec 2009

    Posted 30 May 2013 Link to this post

    I want to create a Grid with a Toggle button in the first column.

    Each Row describes a layer for a map:

     1) name,  2) size, 3) type, etc.

    In column 0, I would like to put a two-state toggle button.

    [KEEP/DELETE] (if  this layer already exists)

    or a different button if the layer does not exist

    [ADD/SKIP] 

    I have seen the checkbox in the GRID: http://www.kendoui.com/forums/ui/grid/grid-checkbox.aspx , but I think that to add four columns to the row (and to change it to a radio) would be confusing.

    Or is there some other UX idea that I am just blanking out on.

    Once the user has determined which rows to keep, delete, or to download, I will go through the .data() and do the appropriate actions.


  2. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 03 Jun 2013 Link to this post

    Hi Yechezkal,

    Your question seems to be within the scope of our premium support and consulting services, because it is related to general programming and design.

    Let me know if you need more specific information with regard to the Grid functionality, API or behavior. 

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Dr.YSG
    Dr.YSG avatar
    210 posts
    Member since:
    Dec 2009

    Posted 05 Jun 2013 Link to this post

    I am not asking to for someone to write my code, or design it. I am already a pretty sophisicticated KendoUI paying customer, who started with your first version. But I did not write this Framework, so I am looking for some guidance.

    As you can see from this Forum Post, (which has a JsFiddle) some of this can be done by row templates: http://www.kendoui.com/forums/ui/grid/grid-checkbox.aspx

    The issue is that here he has a checkbox, and I need to show a two-state toggle button [Keep/Delete]. Where the text of the column depends on the values of a hidden column).

    But I do admit that I might have fixed on a very narrow UX paradigm, and that perhaps there is something in the KendoUI Framework, that better matches what I am looking for, so if you have a pointer to that, I can look into it (e.g. perhaps just an editable row, which only has the DELETE button on it).


  5. Answer
    Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 07 Jun 2013 Link to this post

    Hi Yechezkal,

    You can use a command column with a delete button, or add a column or a row template with a
    custom button, which will remove the row by using the Grid datasource API and the remove() method. This method accepts a model as a parameter, which can be retrieved via the getByUid() or dataItem() methods.

    When using templates and evaluating data fields from the model, you will need to use expressions inside the template.

    http://docs.kendoui.com/getting-started/framework/templates/overview

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Dr.YSG
    Dr.YSG avatar
    210 posts
    Member since:
    Dec 2009

    Posted 07 Jun 2013 Link to this post

    Thank you, that is all I needed to get started.
Back to Top
Kendo UI is VS 2017 Ready