.NET এমভিসি 3 রেজার এডিটর সহ এইচটিএমএল 5 স্থানধারক বর্ধনের জন্য?

Question 1

@ এইচটিএমএল ব্যবহার করে এইচটিএমএল 5 প্লেসহোল্ডার লেখার কোনও উপায় আছে?

@Html.TextBoxFor(model => model.Title, new { @placeholder = "Enter title here"})

অথবা এটা এই অর্থে যে হয়তো DataAnnotations মাধ্যমে 'বিবরণ' প্রদর্শন অ্যাট্রিবিউট (অনুরূপ ব্যবহার করতে পারেন আমাদের নিজস্ব এক্সটেনশন লিখতে হবে এই )?

অবশ্যই, তারপরে একই প্রশ্নটি 'অটোফোকাস' এর ক্ষেত্রেও প্রযোজ্য।

Question 2

কাস্টম লেখার জন্য আপনি নীচের নিবন্ধটি একবার দেখে নিতে পারেন DataAnnotationsModelMetadataProvider।

এবং সদ্য প্রবর্তিত IMetadataAware ইন্টারফেস জড়িত এগিয়ে যাওয়ার আরও একটি এএসপি.নেট এমভিসি 3 উপায়' s

এই ইন্টারফেসটি প্রয়োগ করে একটি কাস্টম বৈশিষ্ট্য তৈরি করে শুরু করুন:

public class PlaceHolderAttribute : Attribute, IMetadataAware
{
    private readonly string _placeholder;
    public PlaceHolderAttribute(string placeholder)
    {
        _placeholder = placeholder;
    }

    public void OnMetadataCreated(ModelMetadata metadata)
    {
        metadata.AdditionalValues["placeholder"] = _placeholder;
    }
}

এবং তারপরে এটি আপনার মডেলটি সাজান:

public class MyViewModel
{
    [PlaceHolder("Enter title here")]
    public string Title { get; set; }
}

পরবর্তী একটি নিয়ামক সংজ্ঞায়িত:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View(new MyViewModel());
    }
}

একটি সম্পর্কিত মতামত:

@model MyViewModel
@using (Html.BeginForm())
{
    @Html.EditorFor(x => x.Title)
    <input type="submit" value="OK" />
}

এবং অবশেষে সম্পাদক টেম্পলেট ( ~/Views/Shared/EditorTemplates/string.cshtml):

@{
    var placeholder = string.Empty;
    if (ViewData.ModelMetadata.AdditionalValues.ContainsKey("placeholder"))
    {
        placeholder = ViewData.ModelMetadata.AdditionalValues["placeholder"] as string;
    }
}
<span>
    @Html.Label(ViewData.ModelMetadata.PropertyName)
    @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { placeholder = placeholder })
</span>

Question 3

দারিন দিমিত্রভের উত্তরে স্ম্নবিএস মন্তব্য হিসাবে Promptঠিক এই উদ্দেশ্যে উপস্থিত রয়েছে, তাই কাস্টম বৈশিষ্ট্য তৈরি করার দরকার নেই । ডকুমেন্টেশন থেকে:

পাওয়া যায় বা একটি মান সেট করে যা ইউআইতে প্রম্পটের জন্য ওয়াটারমার্ক সেট করতে ব্যবহৃত হবে।

এটি ব্যবহারের জন্য, কেবল আপনার মতামতের মডেলটির সম্পত্তিটি সাজান:

[Display(Prompt = "numbers only")]
public int Age { get; set; }

এই পাঠ্যটি তখন সুবিধার্থে স্থাপন করা হয়েছে ModelMetadata.Watermark। বাক্সের বাইরে, এমভিসি 3 এ ডিফল্ট টেম্পলেটটি Watermarkসম্পত্তিটিকে উপেক্ষা করে , তবে এটিকে কাজ করা সত্যিই সহজ। এমভিসি কীভাবে এটি রেন্ডার করতে হয় তা বলার জন্য আপনাকে কেবল ডিফল্ট স্ট্রিং টেম্পলেটটি টুইট করতে হবে। ডারিনের মতো স্ট্রিং.সি.এস.টি.এম.এল সম্পাদনা করুন, ওয়াটারমার্কটি প্রাপ্ত করার পরিবর্তে ModelMetadata.AdditionalValuesআপনি এটিকে সরাসরি পান ModelMetadata.Watermark:

Views / ভিউ / ভাগ করা / সম্পাদকআপনিপ্লেটগুলি / স্ট্রিং.একএসটিএমএল:

@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { @class = "text-box single-line", placeholder = ViewData.ModelMetadata.Watermark })

এবং এটি হয়।

আপনি দেখতে পাচ্ছেন যে, সমস্ত কিছু কাজ করার মূল চাবিকাঠিটি placeholder = ViewData.ModelMetadata.Watermarkকিছুটা।

আপনি যদি মাল্টি-লাইন পাঠ্যবাক্সগুলির জন্য (টেক্সারিয়াস) ওয়াটারমার্কিং সক্ষম করতে চান তবে আপনি মাল্টিলাইনটেক্সট.সিএসটিএমএল এর জন্যও তাই করুন:

Views / ভিউ / ভাগ করা / সম্পাদকTemplets / MultilineText.cshtml:

@Html.TextArea("", ViewData.TemplateInfo.FormattedModelValue.ToString(), 0, 0, new { @class = "text-box multi-line", placeholder = ViewData.ModelMetadata.Watermark })

Question 4

আমি আসলে বেশিরভাগ সময় স্থানধারীর পাঠ্যের জন্য প্রদর্শনের নামটি ব্যবহার করতে পছন্দ করি। এখানে ডিসপ্লে নাম ব্যবহার করার উদাহরণ রয়েছে:

  @Html.TextBoxFor(x => x.FirstName, true, null, new { @class = "form-control", placeholder = Html.DisplayNameFor(x => x.FirstName) })

Question 5

আমি একটি সাধারণ ক্লাস লিখেছি:

public static class WatermarkExtension
{
    public static MvcHtmlString WatermarkFor<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression)
    {
        var watermark = ModelMetadata.FromLambdaExpression(expression, html.ViewData).Watermark;
        var htmlEncoded = HttpUtility.HtmlEncode(watermark);
        return new MvcHtmlString(htmlEncoded);
    }
}

যেমন ব্যবহার:

@Html.TextBoxFor(model => model.AddressSuffix, new {placeholder = Html.WatermarkFor(model => model.AddressSuffix)})

এবং একটি ভিউ মডেলে সম্পত্তি:

[Display(ResourceType = typeof (Resources), Name = "AddressSuffixLabel", Prompt = "AddressSuffixPlaceholder")]
public string AddressSuffix
{
    get { return _album.AddressSuffix; }
    set { _album.AddressSuffix = value; }
}

প্রম্পট পরামিতি লক্ষ্য করুন। এই ক্ষেত্রে আমি স্থানীয়করণের জন্য সংস্থান থেকে স্ট্রিং ব্যবহার করি তবে আপনি কেবল স্ট্রিং ব্যবহার করতে পারেন, কেবল রিসোর্সটাইপ পরামিতি এড়াতে পারেন।

Question 6

আমি রিসোর্স ফাইলের সাথে এইভাবে ব্যবহার করি (আর প্রম্পটের দরকার নেই!)

@Html.TextBoxFor(m => m.Name, new 
{
     @class = "form-control",
     placeholder = @Html.DisplayName(@Resource.PleaseTypeName),
     autofocus = "autofocus",
     required = "required"
})

Question 7

উপরের ধারণাগুলি ব্যবহার করে আমি তৈরি একটি সমাধান এখানে পাঠ্যবক্সফোর্ড এবং পাসওয়ার্ডফোর্ডের জন্য ব্যবহার করা যেতে পারে:

public static class HtmlHelperEx
{
    public static MvcHtmlString TextBoxWithPlaceholderFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper,
        Expression<Func<TModel, TProperty>> expression, object htmlAttributes)
    {
        var metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
        return htmlHelper.TextBoxFor(expression, htmlAttributes.AddAttribute("placeholder", metadata.Watermark));

    }

    public static MvcHtmlString PasswordWithPlaceholderFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper,
        Expression<Func<TModel, TProperty>> expression, object htmlAttributes)
    {
        var metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
        return htmlHelper.PasswordFor(expression, htmlAttributes.AddAttribute("placeholder", metadata.Watermark));

    }
}

public static class HtmlAttributesHelper
{
    public static IDictionary<string, object> AddAttribute(this object htmlAttributes, string name, object value)
    {
        var dictionary = htmlAttributes == null ? new Dictionary<string, object>() : htmlAttributes.ToDictionary();
        if (!String.IsNullOrWhiteSpace(name) && value != null && !String.IsNullOrWhiteSpace(value.ToString()))
            dictionary.Add(name, value);
        return dictionary;
    }

    public static IDictionary<string, object> ToDictionary(this object obj)
    {
        return TypeDescriptor.GetProperties(obj)
            .Cast<PropertyDescriptor>()
            .ToDictionary(property => property.Name, property => property.GetValue(obj));
    }
}

Question 8

আমি মনে করি একটি কাস্টম এডিটর টেম্প্লেট তৈরি করা ভাল সমাধান নয়, কারণ বিভিন্ন ক্ষেত্রে আপনার অনেকগুলি সম্ভাব্য টেপমলেটগুলির যত্ন নেওয়া দরকার: স্ট্রিং, নামজার্স, কম্বোবক্স এবং আরও অনেক কিছু। অন্যান্য সমাধান হ'ল এইচটিএমএলহেল্পারের কাস্টম এক্সটেনশন।

মডেল:

public class MyViewModel
{
    [PlaceHolder("Enter title here")]
    public string Title { get; set; }
}

এইচটিএমএল সহায়ক সম্প্রসারণ:

   public static MvcHtmlString BsEditorFor<TModel, TValue>(this HtmlHelper<TModel> htmlHelper,
    Expression<Func<TModel, TValue>> expression, string htmlClass = "")
{
    var modelMetadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
    var metadata = modelMetadata;

    var viewData = new
    {
        HtmlAttributes = new
            {
                @class = htmlClass,
                placeholder = metadata.Watermark,
            }
    };
    return htmlHelper.EditorFor(expression, viewData);

}

একটি সম্পর্কিত মতামত:

@Html.BsEditorFor(x => x.Title)