CODEWITHSUNDEEP
c#jquery.netasp.net-mvc-3
Sometimes Code
Sometimes Code

Reputation: 601

How to Create Custom "type" attribute for textboxfor in Asp.net MVC?

I am working in MVC. I have stuck badly in a situation. As we know,

    @Html.Textboxfor

have a property named type which detects the type of input which the textbox can take.

For Ex: type = "email" takes email as input and if validation fails it shows error message like "Please Enter valid Email Address".

type = "number" takes number only as input and shows validation message if text will use.

I want that my textbox will take Mobile/Phone numbers(with country codes and without country codes as well. e.g. +9177777777777).

So Can i create my own custom "type" attribute which can accomplish above task and can generates my own validation message if validation fails ?

Upvotes: 3

Views: 6202

Answers (3)

Floremin
Floremin

Reputation: 4089

The attribute type you are talking about is an attribute of <input /> html element. As per HTML5 specifications there are only several valid values this attribute can take. See them here: http://www.w3schools.com/html/html5_form_input_types.asp

So, you cannot just add any sort of "custom" value which would imply some automatic validation by the browser. What you want, I think, is to be able to validate input against a specific phone number format. For that you need to use [RegularExpression] attribute (entirely different thing, but named the same) on the property in your model class. This, coupled with unobtrusive client side validation, would give you the behaviour you want.

Update

Different values of type attribute enable you to invoke browser's native client side validation support. For custom formats, use general type="text" and put regular expression in the pattern attribute. Browser will display an error popup with the message from the title attribute.

So, in your view you could have something like this:

@Html.TextBoxFor(m => m.PhoneNumber, new { pattern = "\d{3}-\d{3}-\d{4}" })

Assuming the property name is PhoneNumber. Your regular expression will be different depending on the actual format you want to support.

I think it's worth mentioning another couple of attributes related to validation:

  • required
  • maxlength

More about native client side validation here: http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/

Upvotes: 3

Tsagoy
Tsagoy

Reputation: 80

Yes it is possible, you'll find here the solution you prefer : http://www.asp.net/mvc/tutorials/older-versions/views/creating-custom-html-helpers-cs

Edit : I was thinking about your question, i think i was wrong. Your can add what you call "Custom Type" using the Mvc "Template".

For example : Create a "DisplayTemplates" directory into the "Shared" folder of your view.

Inside this new one, create a PartialView typed with your custom Model. Put everithing you want into your new partial view/model to do what you espect.

After into your main view page. Juste call @Html.DisplayFor(model=>model.YourNewCustomModel) and MVC does the rest. For sure, your new CustomModel has to be a part of the main calling page model.

Upvotes: 0

nfplee
nfplee

Reputation: 7977

Maybe i'm missing something, but you could simply say the following (replacing the ??? accordingly):

@Html.TextBoxFor(m => m.???, new { type = "???" })

Upvotes: 0

Related Questions