I've implemented a working datepicker in a form, which is part of my asp.net mvc project. However, I am having trouble obtaining the input value. For the other attributes in the form, I've been using Html.EditorFor(), but in this case, that does not work as it results in two text boxes appearing. I've been unable to find a solution on the Internet and have looked for alternatives to EditorFor, but so far, have not found anything that works.
<div class="form-group">
#Html.Label("date:", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-3">
<input type="text" class="form-control" id="date">
</div>
</div>
Any help would be greatly appreciated.
I'm assuming when you say "having trouble obtaining the input value," you mean that the the "date" param of the posted form's controller action isn't getting populated.
First try TextBoxFor(). If that doesn't work, you may need to use the name attribute in your input element.
<input type="text" class="form-control" id="date" name="date">
If you are not averse to using jQuery, you could just use this line:
var date = $('#date').val();
and then find a way to pass the javascript variable to your controller
An easy solution to this was to add a name attribute to the tag, and pass this as a parameter to the controller method.
Related
I am trying to build a InputText for Blazor which holds a placeholder if the skill is yet null so is created as a new one, since I want to use the same razor component for edit and create new skill.
my code is
<div class="form-group">
<label>Skillname</label>
#if (Skill == null)
{
<InputText class="form-control" placeholder="Enter Skillname" #bind-Value="Skill.Name"/>
}
else
{
<InputText #bind-Value="Skill.Name" class="form-control"/>
}
</div>
I tried to set placeholder=.".." without having any effect. After research I found that they were using placeholder here even though it is not working for me.
I only found this possibility with telerik front end framework.
I was not able to find any reference to placeholder in the documentation.
Andy idea why placeholder is not working here or if there is any other workaround to achieve this?
There is no intellisense and that is what confuses people.
However, if you just use the placeholder attribute it will work.
<InputText id="lastName" class="form-control" placeholder="Last Name" #bind-Value="EmployeeVM.LastName"></InputText>
You're binding to #bind-Value="Skill.Name" so I'm assuming Skill isn't null. Your test is on skill, not skill.Name, so is never null you always hit the else option. Try:
#if (string.IsNullOrEmpty(skill.Name))
{
......
}
And you get:
However, you don't need to do any of this as the placeholder will only display when the field is empty.
Is there any way to disbale jquery validation on certain input fields inside a form? So that it won't bother me with the 'red text under my input' or whenever I submit my form. I'm searching for a while now but without any succes. I tried using formnovalidate="formnovalidate" from this questions but also without any succes.
Here's my cshtml input code:
<div class="form-group">
<label asp-for="preExposure" class="control-label"></label>
<input asp-for="preExposure" id="preExposureInput" class="form-control" type="text"/>
<span asp-validation-for="preExposure" class="text-danger"></span>
</div>
Although I posted as a comment that it was pretty similar to the linked question, the most important part of that answer is below:
Once you have the jquery validation turned on for the form with the .validate() you can still configure the rules for the individual element that you want, and remove all the rules.
$('#myfield').rules('remove'); // removes all rules for this field
I'm checking out Asp.Net Core on .Net core. Scaffolding has created some templates. The default validation for the model is not sufficient, so I've added some extra validation when the object is send to the controller
ViewData.ModelState.AddModelError(nameof(Invoice.InvoiceNr), "Invoice number should be unique.");
Now in the browser I only see that message when #Html.ValidationMessage("InvoiceNr") is added to the cshtml file. Only asp-validation-for="InvoiceNr" does not seem to present any property errors.
It took some time before I figured this out. Can someone shed some light on this why this is, it seems counter-intuitive to me, to have to add 2 lines to show all validation errors.
Thanks!
#Shyju
<div class="form-group">
<label asp-for="InvoiceNr" class="col-md-2 control-label"></label>
<div class="col-md-10">
<input asp-for="InvoiceNr" class="form-control"/>
<span asp-validation-for="InvoiceNr" class="text-danger" />
</div>
</div>
#GSerg
The reason it is not working is because you are not using the validation-for tag helper correctly. Instead of using the self closing notation, you should use an explicit closing for the span.
Replace
<span asp-validation-for="InvoiceNr" class="text-danger" />
With
<span asp-validation-for="InvoiceNr" class="text-danger"></span>
In short, you do not need to use both the tag helper and the html helper together to the the validation error. With the correct usage of tag helper, you will be able to see the validation error message.
How does one set the label of a checkbox? I looked at some sites and they are using lambda expressions, but I can't understand them. I am new to asp.net MVC.
#{
bool chkVal = false;
}
<li>#Html.CheckBox("chksumma",chkVal,new {#value = "5"})</li>
<li>#Html.LabelFor(, "");
This is a really good way:
<div class="checkbox">
<label>#Html.CheckBoxFor(x => item.IsSelected) #Html.DisplayNameFor(x => item.IsSelected)</label>
</div>
It's what is recommended by bootstrap 3.
It works in a table.
You can click on the check box OR the label to select the box. (This is an important usability feature.)
The cursor is properly the "hand" instead of the arrow pointer.
EDIT
This is really easy to do in Bootstrap 4.
You just wrap your label and input inside form-check markup:
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="defaultCheck1">
<label class="form-check-label" for="defaultCheck1">Default checkbox</label>
</div>
If you are using a Model you could do:
<li>#Html.CheckBoxFor(f=> f.chksumma)</li>
<li>#Html.LabelFor(f=> f.chksumma)</li>
Then use the attributes TGH pointed out
otherwise if you don't have a model all you can do for labels is:
#Html.Label("LabelText")
which prints a standalone label
or and craft it if you want it to link with the item
<label for="chksumma">LAbelText</label>
If you really don't want to hand craft it you can write your own HTML helper as explained here
http://develoq.net/2011/how-to-create-custom-html-helpers-for-asp-net-mvc-3-and-razor-view-engine/
I'm assuming that you want the label to tick the checkbox when you click on it.
In this case, the for attribute of the HTML <label> field must point to the ID of the relevant input element.
If you're using a model, #Html.CheckBoxFor will generate a checkbox without an ID, so you will need to add an ID to the checkbox, then point your label to the same ID. The easiest way is to replicate the checkbox's name into its ID field using the #Html.NameFor helper method. Here's an example:
#Html.CheckBoxFor(x => x.Active, new {id=Html.NameFor(x => x.Active)})
<label for="#Html.NameFor(x => x.Active)">Active</label>
Generated HTML (without validation attributes):
<input id="[0].Active" name="[0].Active" type="checkbox" value="true" />
<input name="[0].Active" type="hidden" value="false" />
<label for="[0].Active">Active</label>
I worked on something similar and got around it by this snipped code
<div class="row">
<div class="col-xs-3">
<label>
#Html.CheckBoxFor(x => x.AdvanceSearch.IsExactPhrase)
#Html.LabelFor(x => x.AdvanceSearch.IsExactPhrase)
</label>
</div> ...
Hope it helps the others
You shouldn't need the <label> tag at all:
<div class="block mTop20">
#HtmlCheckboxFor(f => f.prop)
#Html.LabelFor(f=>f.prop,"This is the label text")
</div>
I have a form where a user can upload a file to the sites download section. However when the form is submitted I get this error, without the request ever making it to the action method.
"The input is not a valid Base-64 string as it contains a non-base 64 character, more than two padding characters, or a non-white space character among the padding characters."
Code:
[HttpPost]
[Authorize]
public ActionResult Create(Download dl, HttpPostedFileBase DownloadFile)
{
And
#model Models.Download
#{
ViewBag.Title = "Add Download";
}
<h3>Add Download</h3>
#using (Html.BeginForm("Create", "Download", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.ValidationSummary(true)
<div class="editor-label">Download File</div>
<div class="editor-field">
<input name="DownloadFile" id="DownloadFile" type="file" />
#Html.ValidationMessage("DownloadFile");
</div>
<div class="editor-label">#Html.LabelFor(model => model.Downloads)</div>
<div class="editor-field">
#Html.EditorFor(model => model.Downloads)
#Html.ValidationMessageFor(model => model.Downloads)
</div>
<div class="editor-label">#Html.LabelFor(model => model.DownloadDate)</div>
<div class="editor-field">
#Html.EditorFor(model => model.DownloadDate)
#Html.ValidationMessageFor(model => model.DownloadDate)
</div>
<div class="display-field"><input type="submit" value="Add" /></div>
}
<div>#Html.ActionLink("Back To Downloads", "Index")</div>
Any sugestions?
Thanks,
Alex.
Ok I figured this out finally, It was all caused because I named the file input on the form the same as my models file field, so the model binder was picking this up and trying to bind the posted file directly to the binary property which was throwing an exception because the string was not binary.
So to fix it I simply added this to my create action method:
[HttpPost]
[Authorize]
public ActionResult Create([Bind(Exclude = "DownloadFile")] Download dl, HttpPostedFileBase DownloadFile)
{
By telling the model binder to exclude the field it solved the problem.
Thanks,
Alex.
EDIT: This could also easily be solved by using view models
Alex, you are partially correct with your assessment. The reason why it fails when you have a property of the same name on your model as the name of the input object on the form is due to the fact that the DataType of the matchingly-named property on your model is not System.Web.HttpPostedFileWrapper which is the datatype that the binary-binder will attempt to perform a bind to.
Excluding your property by using the Bind attribute and then extracting the file from the Request.Files collection as you demonstrated may work, but it may be more elegant to let the binder do its thing (provided that the data type is matching as I mentioned above) and then you can simply access the file directly from the property of your model
You could try removing the HttpPostedFileBase from the controller method and use Request.Files[0] and see if that makes a difference.
Honestly though I dont'see why this would be failing unless there is something that is causing it within your Model.
Also, nit picking here but DownloadFile should be downloadFile on your form and in your controller method.