Out side an EditForm I want to use a input type="time" as the following code shows:
<input type="time" class="form-control" id="sTime" #bind="#StartTime">
the Bound Property should be a DateTime variable otherwise it does not allow, As this code shows:
DateTime StartTime { get; set; } = DateTime.Now;
private async Task AddingVisit()
{
...
VisitStart = startDate.Date + TimeSpan.Parse(StartTime.ToShortTimeString());
...
}
But when the code in the method reaches to the point that uses StartTime property, It jumps out from code to HTML and begins doing some works and then does not come back to execute the remaining code, Why this happens and how to solve this?
Strangely, Removing TimeSpan.Parse Solved the problem:
DateTime VisitStart = startDate.Date + StartTime.Value.TimeOfDay;
The execution now is normal, and does not jump to Html.
Related
I have been asked to look at a form on an aspnetcore 3.1 view, although this hopefully will change to aspnetcore 6.0 soon using a standard datetimepicker
<input class="datetimePicker" asp-for="SubmittedDateFrom" asp-format="{0:dd/MM/yyyyTHH:mm}" />
This gives ModelState values like "2022-11-01T18:27" and in the endpoint a value of {01/11/2022 18:27:00} and the date is preserved in the input.
There are various sort columns and paging that use a link to submit the data e.g.
<a asp-controller="Submissions"
asp-action="Index"
asp-route-SortField="Submitted"
asp-route-SortDir="#Model.SortDir"
asp-route-SortDirNext="#Model.SortDirNext"
asp-route-PageSize="#Model.PageSize"
asp-route-PageNumber="#Model.PageNumber"
asp-route-SubmittedDateFrom="#Model.SubmittedDateFrom"
asp-route-SubmittedDateTo="#Model.SubmittedDateTo">
#Html.DisplayNameFor(model => model.First().Submitted)
</a>
The links call the same endpoint as the form submit.
When that link is clicked the ModelState values like "01/11/2022 18:27:00" and in the endpoint a value of {01/11/2022 18:27:00} and the date is lost in the input.
What am I looking at that is incorrect and how can I therefore fix this. I have tried custom date validators, but that was not the solution. I could hard tweak the ModelState to stop losing the input field value but that has to be wrong ad I have not manged to google something that explains this.
Note: The endpoint does not use a model its passed like this
public async Task<ActionResult<IEnumerable<Submission>>> Index(string SortField = "Changed",
SortDirection SortDir = SortDirection.Descending,
SortDirection? SortDirNext = null,
int PageSize = 20,
int PageNumber = 1,
DateTime? SubmittedDateFrom = null,
DateTime? SubmittedDateTo = null)
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 have a DateTime property in my model decorated as
[Display(Name = "Valid From")]
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:dd-MMM-yyyy}", ApplyFormatInEditMode = true)]
public DateTime ValidFrom { get; set; }
When I am using it in html's table's td its format is rendering correctly. This is how I am using it when it renders correctly - #Html.DisplayFor(modelItem => item.ValidFrom)
Its not working in edit/create mode. This is how it created in view by default by scaffolding
<input asp-for="ValidFrom" class="form-control" />
When edit/create form loads it has
Tried by specifying explicit date format but not working
<input asp-for="ValidFrom" class="form-control" data-date-format="dd-MMM-yyyy" />
This is how it renders on the form. Can you please guide what actually missing. Also, how can I set date format of date picker control to dd-MMM-yyyy?
<input asp-for="ValidFrom" class="form-control" />
By using above code, it will generate a <input type= "date" /> element, by default the date format is "mm/dd/yyyy". To change the date format, you could try to change the date type to text type, like this:
<input asp-for="ValidFrom" class="form-control" data-date-format="dd-MMM-yyyy" type="text" placeholder="dd-MMM-yyyy" />
Then, the output as below:
Then, when you change the date, you could use Bootstrap-datepicker or JQuery UI datepicker to select date and change the date format.
[Note] If you are using both Bootstrap and JQuery UI, you might meet the JQuery conflict error, here is a similar thread, you could check it.
It looks like you are not specifying the type on your input
Your date format looks incorrect
I have found issues using asp-for with DateTime model properties (although these may work with string values)
Here is what I have been using in MVC Core 3. Hopefully this will be of help
<input type="date" value="#Model.DateTo.ToHtmlInputDate()" asp-for="DateTo" min="#Model.EarliestDate.ToHtmlInputDate()" max="#Model.LatestDate.ToHtmlInputDate()" onchange="$('form').submit();" class="form-control">
Here is my static helper to extend DateTime
public static string ToHtmlInputDate(this DateTime d)
{
return d.ToString("yyyy-MM-dd");
}
By setting false to the DisplayFormat attribute, I could have it to work in .net 6 and .net 5 MVC
[DataType(DataType.Date)]
[Display(Name = "Date saisine")]
[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = false)]
public DateTime? Birth {get; set;}
I randomly face the issue of missing first character in the ExtJS5 input field, while sending string via sendKeys method.
System info:
Ubuntu 14.04 -> docker containers with selenium grid (2.48.2)
Browser Firefox
Code is simple. I just get input web element, wait if it's clickable (i.e. isEnabled and isDisplayed), clear and send string:
wait.until(ExpectedConditions.elementToBeClickable(input)).clear();
input.sendKeys(value);
input element is simple too:
<input id="textfield-1455-inputEl" data-ref="inputEl" type="text" role="textbox" size="1" name="name" class="x-form-field x-form-required-field x-form-text x-form-text-default x-form-focus x-field-form-focus x-field-default-form-focus" autocomplete="off" componentid="textfield-1455"/>
I've noticed that issue occurs only for the first sendKeys() executing on the page:
Enter the page, wait for page load, work with first input
Enter the page, wait for page load, choose Enable into corresponding select box in order to enable input field, work with input field (image with this example is attached)
Enter the page, wait for page load, click button add in order to add the needed input field, work with input field
Other occurrences of the sendKeys on the page are stable.
I've looked for similar questions. It does not seem the issue with special characters (Missing characters example: 46-> 6; coverTest -> overTest; 1 -> nothing);
Also, I don't think it's an issue with missing characters due to remote webdriver infrastructure. The tests fail randomly but in exact places.
I know that I can use sendKeys(), then check the value of the input and repeat the sending action. However, it's the last option.
Is there any additional check needed for ExtJS input (any attribute in DOM) in order to be sure that input field is ready?
Appreciate your help.
Some times it happens with me. Try clicking on to the field first, but it's a wild guess assuming there can be some focus related issues.
Your sequence could be somewhat like this:
wait.until(ExpectedConditions.elementToBeClickable(input)).click();
input.clear();
input.sendKeys(value);
Weird thing is that I actually faced a situation, where I clicked it twice before sending values and it worked somehow :P
Another thing to try could be using a non-native javascript executor.
JavascriptExecutor myExecutor = ((JavascriptExecutor) driver);
myExecutor.executeScript("arguments[0].value='6';", input);
Sorry man, if the system would have been in front of me I'd have tried much more things.
I was struggling with sendKeys failing my self, but the following works pretty consistently. The method findVisibleElement is a custom wrapper for driver.until....
protected static boolean sendKeysByChar(By by, String input)
{
WebElement field = driver.findVisibleElement(by).base();
field.click();
field.clear();
for (int i = 0; i < input.length(); i++) {
String current = driver.findElement(by).getAttribute("value");
String nextChar = String.valueOf(input.charAt(i));
while (current.length() <= i || !current.endsWith(nextChar)) {
field.sendKeys(nextChar);
current = driver.findElement(by).getAttribute("value");
}
}
field = driver.findElement(by); // Refresh element
if (field.getAttribute("value").equals(input)) { return true; }
log.warn("Send keys by char failed.");
return false;
}
Sorry but I am new to C# and ASP.NET and I saw alot of posts about this problem but I quite didn't get it. I am trying to understand how to pass a GET parameter to an action thru HTML.ActionLink:
here is the the URL:
http://localhost:36896/Movies/SearchIndex?searchString=the
and my CSHTML page should look like this:
<input type="Text" id="searchString" name="searchString" />
#Html.ActionLink("Search Existing", "SearchIndex", new { searchString = "the"})
this hard coded parameter "the" is actually working, but how can I select the input element with id=searchString, with something like document.getElementById("searchString").value
Thanks,
If the value you want to send as GET parameter is not known on the server you cannot use the Html.ActionLink helper to add it. You need to use javascript to manipulate the existing link and append the parameter.
It looks like you have an input field that contains a search string and you want to send the value entered in this field to the server. A better way to handle this scenario is to use an HTML form with method="GET" instead of an ActionLink. This way you don't need to use any javascript - it's part of the HTML specification:
#using (Html.BeginForm("SearchIndex", "Movies", FormMethod.Get))
{
#Html.EditorFor(x => x.SearchString)
<button type="submit">Search</button>
}
Now when you click on the Search button the value entered in the SearchString field will automatically be sent to the SearchIndex action:
http://localhost:36896/Movies/SearchIndex?searchString=the
But if you absolutely insist on using an ActionLink you will have to write javascript to manipulate the href of the existing link when this link is clicked in order to append the value to the url. It's an approach I wouldn't recommend though because the HTML specification already provides you this functionality throughout HTML forms.
This makes the #Html.EditorFor refer to the Title field of the object, kinda in a random way but it works!
#using (Html.BeginForm ("SearchIndex", "Movies", FormMethod.Get))
{
#Html.EditorFor( x => x.ElementAt(0).Title)
<button type="submit">Search</button>
}
Still couldn't pass input parameter to the URL in the GET.
EDIT:
FINAL SOLUTION:
#Html.TextBox("SearchString")
<button type="submit">Filter</button>
and on the controller side, switch the input parameter. Basically it will automatically recognize the passed parameter.
public ActionResult SearchIndex(string searchString)
{
...
}