Using DataSource to add data attributes

4 posts, 0 answers
  1. Matthias
    Matthias avatar
    20 posts
    Member since:
    Feb 2013

    Posted 21 May 2014 Link to this post

    I see that you can set the text and value of list items with dataValueField and dataTextField, but is there any way to set custom attributes with DataSource (ie: data-*)?
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 23 May 2014 Link to this post

    Hi Matthias,

    In general you can create custom fields in the dataSource that you can access via the dataItem, however they are not directly related to the data attributes of the element, and this cannot be achieved out of the box. But as I am not really sure that I understand your question correctly, would it be possible to elaborate a bit more on this matter?

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Bruce
    Bruce avatar
    13 posts
    Member since:
    Mar 2019

    Posted 10 Jul Link to this post

    I had the same question tonight and came across this post. So even though its a really old post, I'm going to answer it.

    You have to specify data_ instead of data- as part of the HtmlAttributes collection.

    So for example:

    Html.Kendo().Button().Name("btnProgressLeadValidation")
        .Content("Promote to Lead")
        .HtmlAttributes(new { type = "button", @class = "k-primary progress-button", data_label = "Lead Validation" })
        .Events(events => events.Click("onProgressClick"))
        .Render();

    Note the data_lead bit in the HtmlAttributes

    That will render at the below Html:

    <button class="k-primary progress-button" data-label="Lead Validation" id="btnProgressLeadValidation" type="button">Promote to Lead</button>

     

    Hope this helps someone.

  4. Dimitar
    Admin
    Dimitar avatar
    431 posts

    Posted 12 Jul Link to this post

    Hi Bruce,

    Thank you for sharing this solution with the community.

    Best regards,
    Dimitar
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top