HTML 用于包装其他扩展的扩展
HTML Extensions for wrapping other extensions
大多数时候,在使用 DevEx MVC 扩展时,我发现自己不得不使用重复代码来生成我经常使用的 controls/layouts。例如,我倾向于 left-aligned 标题而不是控件。理想情况下,我可以做这样的事情并拥有它 "just work":
@Html.DevExpress().TextBoxFor(m => m.Notes).GetHtml()
但是,为了将标题放在左侧,我还需要为其传递一个设置 object,或者圆顶一些更冗长的内容,例如:
@Html.DevExpress().TextBox(
s => {
// ...
s.Properties.CaptionCellStyle.Width = 100;
// ...
}
).Bind(Model.Notes).GetHtml()
我想做的是创建我自己的一组扩展来包装 DevEx 扩展,给我某种 common/core 自定义层,所以我可以做这样的事情:
@Html.MyComponents().TextBoxFor(m => m.Notes)
此调用将依次调用具有一组通用设置的 DevExpress TextBoxExtension 并根据需要输出 DevEx 文本框。
我已经通过自定义 html 扩展(下面的代码)解决了这个问题,但是这个基本实现有两个问题:
- 控件呈现在 Body 元素的最顶部,而不是它在视图中的放置位置,并且
- 存在 JavaScript 错误 "ASPxClientTextBox" 未定义(这是 DevEx 使用其控件的 client-side 脚本的一部分)。
我希望这会是一个简单的 "wrap it and go" 类型的场景。我缺少这些自定义 HTML 扩展的一些基本概念吗?或者有人知道这是否是尝试包装另一家公司的 pre-existing 扩展的一般限制?
这是我已经实现的代码(尚未完全充实,只是在这里尝试概念证明):
public static class HtmlHelpers
{
public static MyComponentsHtmlHelpers<TModel> MyComponents<TModel>(this HtmlHelper<TModel> html) {
return new MyComponentsHtmlHelpers<TModel>(html);
}
}
public class MyComponentsHtmlHelpers<TModel>
{
private HtmlHelper<TModel> html;
public MyComponentsHtmlHelpers(HtmlHelper<TModel> html) {
this.html = html;
}
public MvcHtmlString TextBoxFor<TValue>(Expression<Func<TModel, TValue>> expression) {
var data = ModelMetadata.FromLambdaExpression(expression, html.ViewData);
string propertyName = data.PropertyName;
System.Diagnostics.Debug.WriteLine("PROPERTY NAME: " + propertyName);
TextBoxSettings s = new TextBoxSettings();
s.Name = "textbox_" + propertyName;
s.Properties.Caption = propertyName;
s.Properties.CaptionCellStyle.Width = 100;
TextBoxExtension tb = new TextBoxExtension(s);
return tb.GetHtml();
}
}
没关系 - 清理解决方案并重建并强制刷新测试浏览器几次并确保没有缓存......现在一切正常。
(不确定我是否应该删除这个问题或保留它以防万一有人想尝试相同的...我暂时保留它,随时删除)
大多数时候,在使用 DevEx MVC 扩展时,我发现自己不得不使用重复代码来生成我经常使用的 controls/layouts。例如,我倾向于 left-aligned 标题而不是控件。理想情况下,我可以做这样的事情并拥有它 "just work":
@Html.DevExpress().TextBoxFor(m => m.Notes).GetHtml()
但是,为了将标题放在左侧,我还需要为其传递一个设置 object,或者圆顶一些更冗长的内容,例如:
@Html.DevExpress().TextBox(
s => {
// ...
s.Properties.CaptionCellStyle.Width = 100;
// ...
}
).Bind(Model.Notes).GetHtml()
我想做的是创建我自己的一组扩展来包装 DevEx 扩展,给我某种 common/core 自定义层,所以我可以做这样的事情:
@Html.MyComponents().TextBoxFor(m => m.Notes)
此调用将依次调用具有一组通用设置的 DevExpress TextBoxExtension 并根据需要输出 DevEx 文本框。
我已经通过自定义 html 扩展(下面的代码)解决了这个问题,但是这个基本实现有两个问题:
- 控件呈现在 Body 元素的最顶部,而不是它在视图中的放置位置,并且
- 存在 JavaScript 错误 "ASPxClientTextBox" 未定义(这是 DevEx 使用其控件的 client-side 脚本的一部分)。
我希望这会是一个简单的 "wrap it and go" 类型的场景。我缺少这些自定义 HTML 扩展的一些基本概念吗?或者有人知道这是否是尝试包装另一家公司的 pre-existing 扩展的一般限制?
这是我已经实现的代码(尚未完全充实,只是在这里尝试概念证明):
public static class HtmlHelpers
{
public static MyComponentsHtmlHelpers<TModel> MyComponents<TModel>(this HtmlHelper<TModel> html) {
return new MyComponentsHtmlHelpers<TModel>(html);
}
}
public class MyComponentsHtmlHelpers<TModel>
{
private HtmlHelper<TModel> html;
public MyComponentsHtmlHelpers(HtmlHelper<TModel> html) {
this.html = html;
}
public MvcHtmlString TextBoxFor<TValue>(Expression<Func<TModel, TValue>> expression) {
var data = ModelMetadata.FromLambdaExpression(expression, html.ViewData);
string propertyName = data.PropertyName;
System.Diagnostics.Debug.WriteLine("PROPERTY NAME: " + propertyName);
TextBoxSettings s = new TextBoxSettings();
s.Name = "textbox_" + propertyName;
s.Properties.Caption = propertyName;
s.Properties.CaptionCellStyle.Width = 100;
TextBoxExtension tb = new TextBoxExtension(s);
return tb.GetHtml();
}
}
没关系 - 清理解决方案并重建并强制刷新测试浏览器几次并确保没有缓存......现在一切正常。
(不确定我是否应该删除这个问题或保留它以防万一有人想尝试相同的...我暂时保留它,随时删除)