Using DataSource to add data attributes

[Matthias]

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-*)?

[Kiril Nikolov]

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

 

 

[Bruce]

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.

[Dimitar]

Hi Bruce,

Thank you for sharing this solution with the community.

Best regards,
Dimitar
Progress Telerik

[Jason]

This helped so much. I needed the data attribute and it wasnt clear how to add.