How do I create a template four user input? The requirement is to have an input text box display something line '0000-0000-00" to get a 10 digit number from a user that will be stored in the data base with out the '-'. This is for the aspnet core 3.1 Razor page.
In the view you add a placeholder to the input tag:
<input asp-for="MyProperty" placeholder="0000-0000-00"/>
You decorate the property MyProperty with an regex data annotation:
[RegularExpression("^([0-9]{4})-([0-9]{4})-([0-9]{1})$", ErrorMessage = "Invalid input")]
public string MyProperty{ get; set; }
Related
I'm new to razor and .net, i have a page on an ASP Net Razor project where i popup a modal with a form inside. Inside the form there is a datepicker and i want to set the system date when the page loads and evenly keep it editable.
i've already tried with
#{ string dateNow = DateTime.Now.ToString("dd MM yyyy"); }
<input asp-for="intervento.Data" class="form-control" type="date" value="#dateNow" />
it retrieves the correct date but can't display it. how can i solve this?
Your date should be in the following format yyyy-MM-dd.
So it would look like this:
<input type="date" value="2020-10-23">
Presumably, Intervento.Data is a DateTime property of your PageModel? If so, you should add a DataType attribute to specify that it represents a date, not a time:
[DataType(DataType.Date)]
public DateTime Data { get; set; }
Then you don't need to specify the type on the input. The tag helper will generate the correct value based on the attribute. Also, if you set a default value on the property:
[DataType(DataType.Date)]
public DateTime Data { get; set; } = DateTime.Now;
you won't need to set the value of the input either. ASP.NET will take care of formatting the value correctly to an ISO 8601 format that the input can work with. So the following will suffice:
<input asp-for="intervento.Data" class="form-control" />
I am building a dropdownlist using the answer here: SelectListItem with data-attributes. This will allow me to add a different class and data annotations to different <option>'s
However I am struggling with building the <select> initially. I have
<select name="#Html.NameFor(a=>a.ValueType)"
id="#Html.IdFor(a=>a.ValueType)">
</select>
My ViewModel looks like
[Required(ErrorMessage = "Value Type is required")]
public string ValueType { get; set; }
How do I get the Required annotation validation into the view?
The final html in the browser should look like:
<select id="ValueType" name="ValueType" data-val-required="Value Type is required" data-val="true"></select>
but I currently have:
<select id="ValueType" name="ValueType"></select>
Is there a #Html method to get these data-val from the ViewModel attributes or how do i do this? Do I have to hard-code it?
I am declaring a WebGrid as follows:
#{
WebGrid grid = null;
if (Model.EmailAddressesOfChosenClient.Count<string>() != 0)
{
grid = new WebGrid(Model.EmailAddressesOfChosenClient, ajaxUpdateContainerId: "gridContent");
}
}
Then I am trying to Render the WebGrid as follows without specifying any columns:
<div id="gridContent">
#{ if (grid != null)
{
#grid.GetHtml()
}
}
</div>
My EmailAddressesOfChosenClient property of the Model is IEnumerable of strings where each string is an email address. I would like the WebGrid to contain a single column with title "Email Address" followed by rows of email address strings.
If I render it this way however, my WebGrid shows up with column heading "Length" and the rows contain the length of each email address string.
Why is that? How do I configure things so that I show the email addresses in the rows and with the right column heading? Many thanks
Why is that?
Because if you do not explicitly specify the columns, the helper uses reflection to inspect the public properties of the type and autogenerates a column for them. So the System.String has the .Length public property and thus you get a column for it.
You will need to use a custom column:
#grid.GetHtml(
columns: grid.Columns(
grid.Column("email", format: item => item)
)
)
Alternatively you could define a view model and have your IEnumerable<T> use this view model instead of string.
I am using Kendo UI mvc grid for Data listing. I am making InLine Editing in this Grid.I am using EditorTemplate for DateTime field, so that it will give datetimepicker for DateTime field in InLine Edit Mode.When i am going to Click on Update button, it will give me Validation message like this : 'The must be a date'
columns.Bound(k => k.SevenDaysFrom).Format("{0:dd.MM.yyyy}").EditorTemplateName("DateTime").Width(30);
columns.Bound(k => k.SevenDaysTo).Format("{0:dd.MM.yyyy}").EditorTemplateName("DateTime").Width(30);
here DateTime in EditorTemplateName("DateTime") is the Template file i.e DateTime.cshtml
And this file will contain the Following code :
#model DateTime?
#(Html.Kendo().DateTimePickerFor(m => m))
Now it will give the validation error message while clicking on Update.The Belowe attach is the Validation error :
So, why this is happening is not known to me?
What is the solution for this ? Please Help.
Set the kendo culture:
#{
var culture = "en-GB";
}
<script src="#Url.Content("~/Scripts/kendo/cultures/kendo.culture." + #culture + ".min.js")"></script>
<script> kendo.culture("#culture"); </script>
You should mention the data type in View Model
[DataType(DataType.Date)]
public Nullable<DateTime> SevenDaysFrom { get; set; }
and in kendo Grid you can mention like below,
columns.Bound(k => k.SevenDaysFrom).Format("{0:dd.MM.yyyy}")
refer my another answer
Display only datepicker in kendo inline editing not datetime picker
I have the following model property
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:d/M/yyyy}", ApplyFormatInEditMode = true)]
[Display(Name = "Date of Screening")]
public DateTime? ScreeningDate { get; set; }
and the following view:
#Html.TextBoxFor(model => model.ScreeningDate, new { #class="date maintainState" })
and yet I get this markup for the textbox:
<input value="18/06/2013 12:00:00 AM" class="date maintainState" ... type="text" />
I want the value to be 18/06/2013
It works when I apply #Html.EditorFor, but I need control over the class attribute. What am I doing wrong? Thank you very much.
It works when I apply #Html.EditorFor, but I need control over the
class attribute. What am I doing wrong?
Nothing, it's how things work. Only the EditorFor and DisplayFor helpers respect the [DisplayFormat] attribute.
I understand that you are using TextBoxFor because you want to apply a custom class to the field which is what the EditorFor doesn't allow you to. But that's not true. All that the EditorFor helper does is to render the corresponding editor template. And if you do not have a custom template it renders the default one.
So what?
Well, you write a custom editor template for the DateTime type that will behave as you want. Just like that in ~/Views/Shared/EditorTemplates/DateTime.cshtml:
#Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, ViewData)
And then simply:
#Html.EditorFor(model => model.ScreeningDate, new { #class="date maintainState" })
Now killed 2 rabbits with one bullet:
We applied the desired format
We applied the desired class to the input field
And if you wanna kill a third rabbit and be able to validate this custom format when the form is submitted back (because remember that the default model binder doesn't care much about this [DisplayFormat] attribute) you could write a custom model binder that will respect the [DisplayFormat] attribute, just as I explained here: https://stackoverflow.com/a/7836093/29407