ในขณะที่คำถามถูกกำหนดเป้าหมายไว้ที่ MVC 3.0 เราพบว่าปัญหายังคงมีอยู่ใน MVC 4.0 เช่นกัน MVC 5.0 ในตอนนี้มีโอเวอร์โหลดสำหรับ htmlAttributes
ฉันถูกบังคับให้ใช้ MVC 4.0 ที่ตำแหน่งงานปัจจุบันของฉันและจำเป็นต้องเพิ่มคลาส css สำหรับการรวม JQuery ฉันแก้ไขปัญหานี้โดยใช้วิธีการขยายเดียว ...
วิธีการขยาย:
using System.Linq;
using System.Web.Mvc;
using System.Web.Routing;
using System.Xml.Linq;
namespace MyTest.Utilities
{
public static class MVCHelperExtensionMethods
{
public static MvcHtmlString AddHtmlAttributes(this MvcHtmlString input, object htmlAttributes)
{
// WE WANT TO INJECT INTO AN EXISTING ELEMENT. IF THE ATTRIBUTE ALREADY EXISTS, ADD TO IT, OTHERWISE
// CREATE THE ATTRIBUTE WITH DATA VALUES.
// USE XML PARSER TO PARSE HTML ELEMENT
var xdoc = XDocument.Parse(input.ToHtmlString());
var rootElement = (from e in xdoc.Elements() select e).FirstOrDefault();
// IF WE CANNOT PARSE THE INPUT USING XDocument THEN RETURN THE ORIGINAL UNMODIFIED.
if (rootElement == null)
{
return input;
}
// USE RouteValueDictionary TO PARSE THE NEW HTML ATTRIBUTES
var routeValueDictionary = new RouteValueDictionary(htmlAttributes);
foreach (var routeValue in routeValueDictionary)
{
var attribute = rootElement.Attribute(routeValue.Key);
if (attribute == null)
{
attribute = new XAttribute(name: routeValue.Key, value: routeValue.Value);
rootElement.Add(attribute);
}
else
{
attribute.Value = string.Format("{0} {1}", attribute.Value, routeValue.Value).Trim();
}
}
var elementString = rootElement.ToString();
var response = new MvcHtmlString(elementString);
return response;
}
}
}
การใช้มาร์กอัป HTML:
@Html.EditorFor(expression: x => x.MyTestProperty).AddHtmlAttributes(new { @class = "form-control" })
(ตรวจสอบให้แน่ใจว่าได้รวมเนมสเปซของเมธอดส่วนขยายในมุมมองมีดโกน)
คำอธิบาย:
แนวคิดคือการแทรกลงใน HTML ที่มีอยู่ ฉันเลือกที่จะแยกองค์ประกอบปัจจุบันใช้ LINQ เพื่อ XML XDocument.Parse()ใช้ ฉันผ่าน htmlAttributes objectเป็นประเภท ฉันใช้ MVC RouteValueDictionaryเพื่อแยกวิเคราะห์ htmlAttributes ที่ส่งมาฉันผสานคุณสมบัติที่มีอยู่แล้วหรือเพิ่มแอตทริบิวต์ใหม่หากยังไม่มีอยู่
ในกรณีที่อินพุตไม่สามารถแยกวิเคราะห์ได้โดยXDocument.Parse()ฉันละทิ้งความหวังทั้งหมดและส่งคืนสตริงอินพุตดั้งเดิม
ตอนนี้ฉันสามารถใช้ประโยชน์ของ DisplayFor (การแสดงผลข้อมูลเช่นสกุลเงินที่เหมาะสม) แต่ยังมีความสามารถในการระบุคลาส CSS (และคุณลักษณะอื่น ๆ สำหรับเรื่องนั้น) อาจมีประโยชน์สำหรับการเพิ่มคุณสมบัติเช่นdata-*หรือng-*(เชิงมุม)