PDA

View Full Version : [CLOSED] When using format on datefield server reads wrong value



REB
Sep 22, 2016, 3:59 PM
Hi,

When setting the format property on datefield on a webform, the value is not read correctly on the server, the value is always DateTime.MinValue, the following sample demonstrates the issue


<%@ Page Language="C#" %>

<script runat="server">
protected void Button1_Click(object sender, DirectEventArgs e)
{
X.Msg.Notify(new NotificationConfig {
Icon = Icon.Accept,
Title = "Working",
Html = date.SelectedDate.ToLongDateString()
}).Show();
}
</script>

<!DOCTYPE html>

<html>
<body>
<form runat="server">
<ext:ResourceManager runat="server" Theme="Triton" />
<ext:DateField runat="server" Format="d/m/Y" ID="date">

</ext:DateField>
<ext:Button
ID="Button1"
runat="server"
Text="Submit"
Icon="Accept"
OnDirectClick="Button1_Click"
/>
</form>
</body>
</html>

fabricio.murta
Sep 23, 2016, 12:29 AM
EDIT: This reply is misleading, please skip to the next reply where the user provided a good test case showing the values are actually submit and the problem was translating the date format. Short answer would be: use .NET date/time format, not Ext.Date.parse's

----
Hello @REB!

This may sound confusing, and there are a diversity of discussions about this on our forums. This involves ASP.NET page life cycle and implicit submitting of values.

While when you submit a form you effectively get the results on code behind, DirectMethods or DirectEvents need to be lightweight, so although they are an AJAX call, they do not submit the full form every time you call or trigger one. Imagine you have a form with a gridPanel worth some hundred kilobytes of data and clicked a "check" button to see how a form field validation status was?

That's why you have to pass the parameters to the method or event.

An example with direct events is the item 2 in this example: Buttons - Basic - Overview (http://examples4.ext.net/#/Buttons/Basic/Overview/)

An example with direct methods is the item 3 in this example: Events - DirectMethods - Overview (http://examples4.ext.net/#/Events/DirectMethods/Overview/)

So, you have to do something similar, because you will always be seeing the ASP.NET components' initial states/values from code behind.

Hope this helps!

REB
Sep 23, 2016, 3:16 AM
Hi Fabricio,

While I understand that these ajax calls need to be as lightweight as possible, the example does submit the whole form, the issue is better exemplified by the following code:


<%@ Page Language="C#" %>

<script runat="server">
protected void Page_Load(object s, EventArgs e)
{
if (!X.IsAjaxRequest)
{
formatted.Value = DateTime.Today;
unformatted.Value = DateTime.Today;
}
}


protected void Button1_Click(object sender, DirectEventArgs e)
{
X.Msg.Notify(new NotificationConfig {
Icon = Icon.Accept,
Title = "Working",
Html = $"Formatted = {formatted.SelectedDate.ToShortDateString()}, Unformatted = {unformatted.SelectedDate.ToShortDateString()}"
}).Show();
}
</script>

<!DOCTYPE html>

<html>
<body>
<form runat="server">
<ext:ResourceManager runat="server" Theme="Triton" />
<ext:DateField runat="server" Format="d/m/Y" ID="formatted">

</ext:DateField>
<ext:DateField runat="server" ID="unformatted">

</ext:DateField>
<ext:Button
ID="Button1"
runat="server"
Text="Submit"
Icon="Accept"
OnDirectClick="Button1_Click"
/>
</form>
</body>
</html>

These are the values submitted according to fiddler.

24751

fabricio.murta
Sep 23, 2016, 5:07 PM
Hello! Did you try setting a proper SubmitFormat to your date field? Or else your regional settings, server-side, won't be able to interpret the fields or just swap month by day numbers anyway.

REB
Sep 23, 2016, 5:25 PM
Hi Fabricio,

I have tried many combinations with varying results, here is another sample:



<%@ Page Language="C#" %>

<script runat="server">
protected void Page_Load(object s, EventArgs e)
{
if (!X.IsAjaxRequest)
{
formatted.Value = DateTime.Today;
unformatted.Value = DateTime.Today;
submitFormat1.Value = DateTime.Today;
submitFormat2.Value = DateTime.Today;
submitFormat3.Value = DateTime.Today;
}
}


protected void Button1_Click(object sender, DirectEventArgs e)
{
X.Msg.Notify(new NotificationConfig {
Height= 200,
Icon = Icon.Accept,
Title = "Working",
Html = $@"Formatted = {formatted.SelectedDate.ToShortDateString()}<br>
SubmitFormat1 = {submitFormat1.SelectedDate.ToShortDateString()}<br>
SubmitFormat2 = {submitFormat2.SelectedDate.ToShortDateString()}<br>
SubmitFormat3 = {submitFormat3.SelectedDate.ToShortDateString()}<br>
Unformatted = {unformatted.SelectedDate.ToShortDateString()}"
}).Show();
}
</script>

<!DOCTYPE html>

<html>
<body>
<form runat="server">
<ext:ResourceManager runat="server" Theme="Triton" />
<ext:DateField runat="server" Format="n/j/Y" ID="formatted">

</ext:DateField>
<ext:DateField runat="server" Format="n/j/Y" ID="submitFormat1" SubmitFormat="n/j/Y">

</ext:DateField>
<ext:DateField runat="server" Format="m/d/y" ID="submitFormat2" SubmitFormat="n/j/Y">

</ext:DateField>
<ext:DateField runat="server" Format="m/d/y" ID="submitFormat3" SubmitFormat="m/d/y">

</ext:DateField>
<ext:DateField runat="server" ID="unformatted">

</ext:DateField>
<ext:Button
ID="Button1"
runat="server"
Text="Submit"
Icon="Accept"
OnDirectClick="Button1_Click"
/>
</form>
</body>
</html>

fabricio.murta
Sep 23, 2016, 5:31 PM
Hello! The SubmitFormat must be the same in all usages and it must match your server's regional settings, not what your customers would see. I can provide you with a sample but it probably won't match your server's and it will not work.

Hold on, I'll try to get this submit format from server and set it to each field in the sample you provided. This will probably work best.

Will get back to you soon.

fabricio.murta
Sep 23, 2016, 6:16 PM
Okay, got it! Sorry for the confusion.

Here's what wrong: the date format source!

You should be using .NET Custom Date and Time format string convention (https://msdn.microsoft.com/en-us/library/8kb3ddd4(v=vs.110).aspx) while you were using Ext.Date format string convention (http://docs.sencha.com/extjs/6.0.2/classic/Ext.Date.html). So while it worked to some extent at client-side, it will not communicate back to server-side.

Here's a working version of your last source sample:



<%@ Page Language="C#" %>

<script runat="server">
protected void Page_Load(object s, EventArgs e)
{
if (!X.IsAjaxRequest)
{
formatted.Value = DateTime.Today;
unformatted.Value = DateTime.Today;
submitFormat1.Value = DateTime.Today;
submitFormat2.Value = DateTime.Today;
submitFormat3.Value = DateTime.Today;
}
}

protected void Button1_Click(object sender, DirectEventArgs e)
{
X.Msg.Notify(new NotificationConfig
{
Height = 200,
Icon = Icon.Accept,
HideDelay = 10000,
Title = "Result",
Html = "Formatted = " + formatted.SelectedDate.ToShortDateString() + "<br>" +
"SubmitFormat1 = " + submitFormat1.SelectedDate.ToShortDateString() + "<br>" +
"SubmitFormat2 = " + submitFormat2.SelectedDate.ToShortDateString() + "<br>" +
"SubmitFormat3 = " + submitFormat3.SelectedDate.ToShortDateString() + "<br>" +
"Unformatted = " + unformatted.SelectedDate.ToShortDateString()
}).Show();
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title></title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" Theme="Triton" />
<ext:DateField runat="server" Format="M/d/yyyy" ID="formatted" />
<ext:DateField runat="server" Format="M/d/yy" ID="submitFormat1" />
<ext:DateField runat="server" Format="MM/dd/yy" ID="submitFormat2" />
<ext:DateField runat="server" Format="dd/MM/yyyy" ID="submitFormat3" />
<ext:DateField runat="server" ID="unformatted" />
<ext:Button
ID="Button1"
runat="server"
Text="Submit"
Icon="Accept"
OnDirectClick="Button1_Click" />
</form>
</body>
</html>


The SubmitFormat mentioned earlier is used only when you have a FormPanel on your page.

So, besides me mistaking the format examples you used, all the fields above returns the current day in the notification panel.

Hope this helps, and thanks for the simplified example test cases!

EDIT: all this conclusions were raised with the help of this thread from last year: DateField with Format always returns minimal date (http://forums.ext.net/showthread.php?57471).

REB
Sep 23, 2016, 8:34 PM
Thank you Fabricio, this indeed solves the sample, will try with the real application a report back my results, btw you should add a note in the samples stating that the Extjs date formats will work, recommend using .Net formats instead if the value is going to be read in a PostBack or a DirectEvent.

Regards.

fabricio.murta
Sep 23, 2016, 9:37 PM
Hello! Thanks for the feedback, and we are looking forward for your final results (hopefully positive!).

Just wondering which samples you are suggesting to review. Are they the ones we exchanged here, or some specific samples in the Examples Explorers, maybe?

REB
Sep 24, 2016, 2:54 AM
The issue has been resolved.

About the examples, I thought you had one on custom date formats, but you don't, you should include one.

On a side note, while looking for the example I noticed that this one DateField/Overview (http://examples.ext.net/Examples/Form/DateField/Overview/) has a part of pickers cut due to the Triton theme requiring more space


Regards.

fabricio.murta
Sep 26, 2016, 5:39 PM
Hello @REB!

Glad it solved the issue, and thanks for the suggestion of adding a sample regarding this use case!

As for the glitches in the example you pointed, we've just fixed it. As the example was written for the Gray theme, the newer themes ended up breaking it, as it did to other examples we already found and fixed in the past. We tried to fix as many as we could, but still some were left behind, and we fix as they are found. The sample you pointed should show fine in all themes now.