Data attributes on the AutocompleteFor html element

[stevenwoolston]

The HtmlHelper that builds the dictionary, which is then used to populate the attributes of the resulting input, does not cater for data attributes to W3C standards. For example, there might be a use case to add a data attribute to the html element which is then used in the onselected method of the typeahead.mvc.model.js. This could be done, for example, to update another element on the form once the Autocomplete control is selected.

The convention in MVC views to add data attributes is to use the data_attributeName syntax using an underscore delimiter. If this is done, the AutocompleteFor HtmlHelper simply populates the data attribute in it's exact form on the html element - using the underscore. However, this is against W3C convention for data attributes.

I suggest that a change be made to the HtmlHelper to allow for data attributes. Here is a code block to do so (starting at line 86 of HtmlHelpers.cs)

var htmlAttributesPropertyNamesAndValues = pair.Value.GetType()
	.GetProperties()
	.Where(pi => pi.PropertyType == typeof (string) && pi.GetGetMethod() != null)
	.Select(pi => new
	{
		Name = pi.Name,
		Value = pi.GetGetMethod().Invoke(pair.Value, null)
	});
foreach (var pair2 in htmlAttributesPropertyNamesAndValues)
{
	var pair2Name = pair2.Name;
	if (pair2Name.Contains("data_"))
	{
		var dataAttributeName = pair2.Name.Replace("data_", "data-");
		pair2Name = dataAttributeName;
	}
	((IDictionary<string, object>) htmlAttributes).Add(pair2Name, pair2.Value);
}

At line 96, a variable is created to hold the value of the pair name. This value is checked to determine if is a data attribute. If so, replace the underscore accordingly and add the attribute to the dictionary object.

[timdwilson]

Than you, Stephen! Can you submit a pull request for your change and I will include?

…

Sent from my iPhone

On May 14, 2017, at 5:19 AM, Steven Woolston ***@***.***> wrote: The HtmlHelper that builds the dictionary, which is then used to populate the attributes of the resulting input, does not cater for data attributes to W3C standards. For example, there might be a use case to add a data attribute to the html element which is then used in the onselected method of the typeahead.mvc.model.js. This could be done, for example, to update another element on the form once the Autocomplete control is selected. The convention in MVC views to add data attributes is to use the data_attributeName syntax using an underscore delimiter. If this is done, the AutocompleteFor HtmlHelper simply populates the data attribute in it's exact form on the html element - using the underscore. However, this is against W3C convention for data attributes. I suggest that a change be made to the HtmlHelper to allow for data attributes. Here is a code block to do so (starting at line 86 of HtmlHelpers.cs) var htmlAttributesPropertyNamesAndValues = pair.Value.GetType() .GetProperties() .Where(pi => pi.PropertyType == typeof (string) && pi.GetGetMethod() != null) .Select(pi => new { Name = pi.Name, Value = pi.GetGetMethod().Invoke(pair.Value, null) }); foreach (var pair2 in htmlAttributesPropertyNamesAndValues) { var pair2Name = pair2.Name; if (pair2Name.Contains("data_")) { var dataAttributeName = pair2.Name.Replace("data_", "data-"); pair2Name = dataAttributeName; } ((IDictionary<string, object>) htmlAttributes).Add(pair2Name, pair2.Value); } At line 96, a variable is created to hold the value of the pair name. This value is checked to determine if is a data attribute. If so, replace the underscore accordingly and add the attribute to the dictionary object. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.