DateField behaviour when within a zone

classic Classic list List threaded Threaded
16 messages Options
Reply | Threaded
Open this post in threaded view
|

DateField behaviour when within a zone

Christopher
Hi all,

I've successfully been using the datefield component within a number of
tapestry pages.  But now that I've embedded a datefield within a custom
component that is nested within a zone, the datepicker isn't working as it
should.  When the datepicker is used to select a certain date, the zone
refreshes but the date remains null.  Naturally I would like the date to
reflect that which was chosen, but also there is no need for the zone to
refresh simply because a date in the datepicker was clicked on.  So two
wrongs.

Incidentally, it is possible to manually type a date into the datefield,
just not use the datepicker.  And it is not a browser related problem
(tested on Chrome and Firefox).


Below are the relevant snippets of markup received by the browser:

<div class="filter-date">
    <label for="paneStartDate" class="control-label">Start</label>
    <div class="input-group"
data-format-url="/harbour/dashboard.operationpanel.filterpane.panestartdate:format?t:ac=operationZone"
data-parse-url="/harbour/dashboard.operationpanel.filterpane.panestartdate:parse?t:ac=operationZone"
data-component-type="core/DateField">
        <input placeholder="dd mmm yyyy hh:mm" value="" id="paneStartDate"
name="paneStartDate" class="form-control" type="text">
        <span class="input-group-btn">
            <button alt="[Show]" class="btn btn-default" type="button">
                <span class="glyphicon glyphicon-calendar"></span>
            </button>
        </span>
    </div>
</div>

<div class="filter-apply">
    <input value="Apply Filter" class="" type="submit">
</div>


And, for the sake of comparison, a snippet of the HTML generated by a
Tapestry page, where the datefield works correctly:

<div class="form-group">
    <label for="startTime" class="control-label col-md-4">Start Time</label>
    <div class="input-group"
data-format-url="/harbour/event/create.starttime:format?t:ac=Dashboard/4"
data-parse-url="/harbour/event/create.starttime:parse?t:ac=Dashboard/4"
data-component-type="core/DateField">
        <input placeholder="event start time (&quot;dd mmm yyyy
hh:mm&quot;)" data-required-message="You must provide a value for
Start Time." data-optionality="required" data-validation="true"
value="" id="startTime" name="startTime" class="form-control"
type="text"></input>
        <span class="input-group-btn">
            <button alt="[Show]" class="btn btn-default" type="button">
                <span class="glyphicon glyphicon-calendar"></span>
            </button>
        </span>
    </div>
</div>

<input value="Create Event" class="opto-button create-event-btn"
type="submit"></input>

Appreciate your help,

Chris.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
Hello!

Something I did in my day job was to create an Html5DateField class by
copying the DateField sources and removing all the JavaScript from it and
also hardcoding the date format to yyyy-MM-dd. In addition, instead of
outputting <input type="text">, it outputs <input type="date", so it uses
the browser's native date picker. If you want to have Html5DateField
replacing all DateField instances, you can contribute to the
ComponentOverride service added in Tapestry 5.4.

I'll ask my bosses whether I can share Html5DateField to the mailing list
and also include it in the next Tapestry releases.

On Thu, Nov 29, 2018 at 5:34 AM Christopher Dodunski <
[hidden email]> wrote:

> Hi all,
>
> I've successfully been using the datefield component within a number of
> tapestry pages.  But now that I've embedded a datefield within a custom
> component that is nested within a zone, the datepicker isn't working as it
> should.  When the datepicker is used to select a certain date, the zone
> refreshes but the date remains null.  Naturally I would like the date to
> reflect that which was chosen, but also there is no need for the zone to
> refresh simply because a date in the datepicker was clicked on.  So two
> wrongs.
>
> Incidentally, it is possible to manually type a date into the datefield,
> just not use the datepicker.  And it is not a browser related problem
> (tested on Chrome and Firefox).
>
>
> Below are the relevant snippets of markup received by the browser:
>
> <div class="filter-date">
>     <label for="paneStartDate" class="control-label">Start</label>
>     <div class="input-group"
>
> data-format-url="/harbour/dashboard.operationpanel.filterpane.panestartdate:format?t:ac=operationZone"
>
> data-parse-url="/harbour/dashboard.operationpanel.filterpane.panestartdate:parse?t:ac=operationZone"
> data-component-type="core/DateField">
>         <input placeholder="dd mmm yyyy hh:mm" value="" id="paneStartDate"
> name="paneStartDate" class="form-control" type="text">
>         <span class="input-group-btn">
>             <button alt="[Show]" class="btn btn-default" type="button">
>                 <span class="glyphicon glyphicon-calendar"></span>
>             </button>
>         </span>
>     </div>
> </div>
>
> <div class="filter-apply">
>     <input value="Apply Filter" class="" type="submit">
> </div>
>
>
> And, for the sake of comparison, a snippet of the HTML generated by a
> Tapestry page, where the datefield works correctly:
>
> <div class="form-group">
>     <label for="startTime" class="control-label col-md-4">Start
> Time</label>
>     <div class="input-group"
> data-format-url="/harbour/event/create.starttime:format?t:ac=Dashboard/4"
> data-parse-url="/harbour/event/create.starttime:parse?t:ac=Dashboard/4"
> data-component-type="core/DateField">
>         <input placeholder="event start time (&quot;dd mmm yyyy
> hh:mm&quot;)" data-required-message="You must provide a value for
> Start Time." data-optionality="required" data-validation="true"
> value="" id="startTime" name="startTime" class="form-control"
> type="text"></input>
>         <span class="input-group-btn">
>             <button alt="[Show]" class="btn btn-default" type="button">
>                 <span class="glyphicon glyphicon-calendar"></span>
>             </button>
>         </span>
>     </div>
> </div>
>
> <input value="Create Event" class="opto-button create-event-btn"
> type="submit"></input>
>
> Appreciate your help,
>
> Chris.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>

--
Thiago
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
That sounds promising Thiago.  Does your component support time also, or
just date (you mentioned yyyy-mm-dd is hardcoded)?

I imagine others are using the existing DateField with success, whether
inside or outside of zones.  Assuming the DatePicker javascript is using
AJAX to invoke a zone refresh, is there perhaps a way of disabling this
without meddling with the code?  I had thought that without "async=true",
components would not invoke zone refreshes.

Regards,

Chris.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
On Fri, Nov 30, 2018 at 4:03 AM Christopher Dodunski <
[hidden email]> wrote:

> That sounds promising Thiago.  Does your component support time also,


Nope, just date, but it could be copied and adapted to one who accepts time
too.


> or just date (you mentioned yyyy-mm-dd is hardcoded)?
>

It's hardcoded because that's the format used by the browsers when sending
the selected date. The actual format presented to the users is
locale-dependent.


> I imagine others are using the existing DateField with success, whether
> inside or outside of zones.  Assuming the DatePicker javascript is using
> AJAX to invoke a zone refresh, is there perhaps a way of disabling this
> without meddling with the code?  I had thought that without "async=true",
> components would not invoke zone refreshes.
>

Not all components have that parameter. DatePicker doesn't trigger zone
refreshes as far as I know.


>
> Regards,
>
> Chris.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>

--
Thiago
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
>> I imagine others are using the existing DateField with success, whether
>> inside or outside of zones.  Assuming the DatePicker javascript is using
>> AJAX to invoke a zone refresh, is there perhaps a way of disabling this
>> without meddling with the code?  I had thought that without "async=true",
>> components would not invoke zone refreshes.

> Not all components have that parameter. DatePicker doesn't trigger zone
> refreshes as far as I know.

According to the Tapestry docs for DateField:

"One wierd aspect here is that, because client-side JavaScript formatting
and parsing is so limited, we (currently) use Ajax to send the user's
input to the server for parsing (before raising the popup) and formatting
(after closing the popup). Weird and inefficient, but easier than writing
client-side JavaScript for that purpose."

Seemingly the serverside formatting is failing, and a container's zone is
getting refreshed instead.  Tomorrow I may delve into how "async=true"
works when zones are nested.  I assume nested zones are allowable?

Regards,

Chris.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
On Sun, Dec 2, 2018 at 9:16 AM Christopher Dodunski <
[hidden email]> wrote:

> > Not all components have that parameter. DatePicker doesn't trigger zone
> > refreshes as far as I know.
>
> According to the Tapestry docs for DateField:
>
> "One wierd aspect here is that, because client-side JavaScript formatting
> and parsing is so limited, we (currently) use Ajax to send the user's
> input to the server for parsing (before raising the popup) and formatting
> (after closing the popup). Weird and inefficient, but easier than writing
> client-side JavaScript for that purpose."
>
> Seemingly the serverside formatting is failing, and a container's zone is
> getting refreshed instead.


Yes, DateField uses AJAX, but not zones, so, if a DateField is causing an
AJAX update, that's definitely a problem there.


> Tomorrow I may delve into how "async=true"
> works when zones are nested.  I assume nested zones are allowable?
>

Yes, nested zones are allowed.


>
> Regards,
>
> Chris.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>

--
Thiago
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
Making some headway...

The base page is "Dashboard", which contains 10 panel components (each
having its own zone).  Three of these panels require a "FilterPane" for
limiting the number of records displayed (again, this filter pane has its
own zone).  This pane contains a form, and this form contains two
datefields.

After examining the application's log files I noticed that using the
datepicker resulted in the dashboard page's onActivate() method being
invoked.  This was unexpected.

03-12-2018 12:02:40 DEBUG Dashboard:74 - [ENTER] onActivate(<EventContext:
movementZone>)
03-12-2018 12:02:40 DEBUG Dashboard:193 - onActivate
03-12-2018 12:02:40 INFO  Dashboard:202 - User Chris [uid:3] accessed the
dashboard page
03-12-2018 12:02:40 DEBUG Dashboard:154 - [ EXIT] onActivate [null]

The above is the result of simply clicking on a date in the DatePicker popup.

At least part of the problem may be the way I've wired the 10 child panels
to the dashboard page itself (FilterPane is a grandchild).

From the child template:

    <a t:type="actionlink" async="true">...</a>

To the dashboard page class:

    public void onActionFromOperationPanel(){
        if(!expandedPanel.equals("operationZone")){
            operationPanel.expand();
        }
        else{
            operationPanel.collapse();
        }

        refreshZone("operationZone", operationZone);
    }

The child component's actionlink obviously bubbles up to the dashboard
page's onActionFrom...() method.  I'm not sure whether this is what's
triggering this page's onActivate() method, but hopefully I'm on the right
track.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
On Sun, Dec 2, 2018 at 10:22 PM Christopher Dodunski <
[hidden email]> wrote:

> After examining the application's log files I noticed that using the
> datepicker resulted in the dashboard page's onActivate() method being
> invoked.  This was unexpected.
>

I'm afraid this is actually expected. Any component event will trigger the
onActivate() method of its containing page, AJAX ones included. The page
should handle its activation context so it's properly initialized for this
request.


>     <a t:type="actionlink" async="true">...</a>
>

Suggestion: don't use ActionLink anymore. I'd consider it at least half
deprecated, with EventLink being the recommended one. ActionLink is
basically an EventLink in which the event name is always "action". Using
ActionLink itself isn't a bug at all. Just using something very vintage
with corresponding event handler methods with longer names.

--
Thiago
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
Just a few short questions to help progress with problem solving.

1) Is there any known reason why DateField's WebFX DatePicker wouldn't
work within an embedded Tapestry component?  I've had no problem with it
working directly in a Tapestry page.  Don't want to be flogging a dead
horse here.  :-)

2) In the HTML source below, you can see that Tapestry isn't generating
well-formed markup in the 2nd example (absent closing </input> tags).  Is
this just a red herring?

3) Despite the DateField tags containing id parameters, could it be that
these text fields are not discoverable after the server is called to parse
the date selected using the DatePicker popup?

Again, the datefield itself accepts textual input.  Just the DatePicker
doesn't work.


**THIS DATEFIELD'S DATEPICKER WORKS CORRECTLY**

    <form class="form-horizontal" data-validate="submit"
action="/harbour/movement/create.registerform" method="post"
id="registerForm">
        <input value="Dashboard" name="t:ac" type="hidden"></input><input
value="K2I7Z6fbINGg1K7hkAtWgn/blEI=:H4sIAAAAAAAAAJVQu0oDQRS9CRqEIIhPJCgBY7tpTKONiSAWQYRoYze7e92M7M6MMzevxta/8AvE2j6Fnf/gB9haWTibhRg3L4WBYc6cF+fpAxY727AZyTZGKKh8opERHja576MAo+FY6sBhinlNdIgpNKR7FceTGkPu2jtSUlihcc4GktKFlh4a02i5ETeGS3H9UFzrFl5yWcjUIe9JQVqG5yxCgtX6LWuzcshEUG6Q5iI46iqCXJI+qVfbWmMY96rM7OUyg07VtSDz6JRj6JcaSC21f9XPv2+8fo2VuYN7yAzCk4jZ4dX/ho+t0n/2D24+H9+yAF3V2YL1dBj1FIKJay2QPfY1lRWTljpF2En/GtvPb4XoE49+zJaH8KWF5+sS+10opGlS84ALFzU1h+b5BKzF4DxNYrwHxTTJt4Nywcju9Nt9ZeQnifiLOsmZsJ6QNLJx/JrKGnh8A1L3LvkuAwAA"
name="t:formdata" type="hidden"></input><input value="Dashboard"
name="hidden" type="hidden"></input>

        <div class="form-group">
            <label for="scheduledTime" class="control-label
col-md-4">Scheduled Time</label>
            <div class="col-md-8">
                <div class="input-group"
data-format-url="/harbour/movement/create.scheduledtime:format?t:ac=Dashboard"
data-parse-url="/harbour/movement/create.scheduledtime:parse?t:ac=Dashboard"
data-component-type="core/DateField"><input
placeholder="scheduled time of movement (&quot;dd mmm yyyy
hh:mm&quot;)" data-required-message="You must provide a
value for Scheduled Time." data-optionality="required"
data-validation="true" value="" id="scheduledTime"
name="scheduledTime" class="form-control"
type="text"></input><span class="input-group-btn"><button
alt="[Show]" class="btn btn-default" type="button"><span
class="glyphicon
glyphicon-calendar"></span></button></span></div>
            </div>
        </div>

        <input value="Create Movement" class="opto-button
create-movement-btn" type="submit"></input>
    </form>


**THIS DATEFIELD'S DATEPICKER FAILS**

<div data-container-type="zone" id="filterZone">

    <form class="filter-container" data-async-trigger="true"
data-validate="submit"
action="/harbour/dashboard.movementpanel.filterpane.filterform"
method="post" id="filterForm">
        <input value="movementZone" name="t:ac" type="hidden"><input
value="Uf5iT4YCrKb6BK/NRv8EvGKwvuI=:H4sIAAAAAAAAAL2UPWgUQRTHXyJRyGEQQS1sLCIS8SZ3eCdBEQneXRSOVW4vShphdnfusjI7M868TU4EawsbKztBsPOj0MIuRVJIrrBR7AVbQQxYGXDGFS0EuV04m/l+7/ef9x7v2WeYWq9AuUHNaiCpjs4mco0lTKCignHSizky7dYkoQPNTMrRgNGwIHWfUEXDVUaQKmZQ366TUGrG48DOiZLCejGkQ6NYLmmZqlmfYaoeVDZOvZrZ2ZyEiTaUQilQS+7RhCEcbN+ka3SeU9Gf91HHon9uoBCmLbmTkQtJrRWQWh0OhsOX/u7GJMBArZ+EEyNguZTKAcmowLY1mK2Xr2x/mIM72+NHVVc+Pd/pvX73uAjKy4WyCUN75SNF1tIy8d0uushj++Qa5SkrP9x8fw+O7f6qgz8Xt+AuTLi87+k2vbGGo/ZV9eaWDj+9kD8cTuQ0wt7u9abXXclj6ixnirCmWpdb/wm179Ky1+g0G+OF5U3XmcqBLws3ntw/n6XrNFRGQLnBINUY2UJ0zPo/mQE1jCwG9pCG2IoZj7KudXx5q/Tx0Jvvf3Wt39W635F8R2pYUlF1i3nVXdUyZMb4aZDExsRSbL2Iar1vj95mQaoCGVEGE1Emwv3oCELJHTZF9PM3+d04L0d/AJVBrr9eBgAA"
name="t:formdata" type="hidden">
        <div class="filter-date">
            <label for="paneStartDate" class="control-label">Start</label>
            <div class="input-group"
data-format-url="/harbour/dashboard.movementpanel.filterpane.panestartdate:format?t:ac=movementZone"
data-parse-url="/harbour/dashboard.movementpanel.filterpane.panestartdate:parse?t:ac=movementZone"
data-component-type="core/DateField"><input placeholder="dd
mmm yyyy hh:mm" value="" id="paneStartDate"
name="paneStartDate" class="form-control" type="text"><span
class="input-group-btn"><button alt="[Show]" class="btn
btn-default" type="button"><span class="glyphicon
glyphicon-calendar"></span></button></span></div>
        </div>
        <div class="filter-apply"><input value="Apply Filter" class=""
type="submit"></div>
    </form>

</div>


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Chris Poulsen
Hi

<input> is valid html, while <input/> is valid xhtml, so depending on what
you are outputting open <input> may be appropriate.

If the built-in datepicker is giving you grief, roll your own... I find
that we (at work) eventually have had to replace almost all of the slightly
fancy "gui" components in tapestry, while the most basic ones still works
like expected (as browsers / styling frameworks etc. gets better and
requires less server-side interaction, the need for server round trips like
the one you mentioned for the date picker diminishes).

Form fields are matched server-side by the "name" attribute (in the servlet
api).

--
Chris

On Thu, Dec 6, 2018 at 4:02 AM Christopher Dodunski <
[hidden email]> wrote:

> Just a few short questions to help progress with problem solving.
>
> 1) Is there any known reason why DateField's WebFX DatePicker wouldn't
> work within an embedded Tapestry component?  I've had no problem with it
> working directly in a Tapestry page.  Don't want to be flogging a dead
> horse here.  :-)
>
> 2) In the HTML source below, you can see that Tapestry isn't generating
> well-formed markup in the 2nd example (absent closing </input> tags).  Is
> this just a red herring?
>
> 3) Despite the DateField tags containing id parameters, could it be that
> these text fields are not discoverable after the server is called to parse
> the date selected using the DatePicker popup?
>
> Again, the datefield itself accepts textual input.  Just the DatePicker
> doesn't work.
>
>
> **THIS DATEFIELD'S DATEPICKER WORKS CORRECTLY**
>
>     <form class="form-horizontal" data-validate="submit"
> action="/harbour/movement/create.registerform" method="post"
> id="registerForm">
>         <input value="Dashboard" name="t:ac" type="hidden"></input><input
>
> value="K2I7Z6fbINGg1K7hkAtWgn/blEI=:H4sIAAAAAAAAAJVQu0oDQRS9CRqEIIhPJCgBY7tpTKONiSAWQYRoYze7e92M7M6MMzevxta/8AvE2j6Fnf/gB9haWTibhRg3L4WBYc6cF+fpAxY727AZyTZGKKh8opERHja576MAo+FY6sBhinlNdIgpNKR7FceTGkPu2jtSUlihcc4GktKFlh4a02i5ETeGS3H9UFzrFl5yWcjUIe9JQVqG5yxCgtX6LWuzcshEUG6Q5iI46iqCXJI+qVfbWmMY96rM7OUyg07VtSDz6JRj6JcaSC21f9XPv2+8fo2VuYN7yAzCk4jZ4dX/ho+t0n/2D24+H9+yAF3V2YL1dBj1FIKJay2QPfY1lRWTljpF2En/GtvPb4XoE49+zJaH8KWF5+sS+10opGlS84ALFzU1h+b5BKzF4DxNYrwHxTTJt4Nywcju9Nt9ZeQnifiLOsmZsJ6QNLJx/JrKGnh8A1L3LvkuAwAA"
> name="t:formdata" type="hidden"></input><input value="Dashboard"
> name="hidden" type="hidden"></input>
>
>         <div class="form-group">
>             <label for="scheduledTime" class="control-label
> col-md-4">Scheduled Time</label>
>             <div class="col-md-8">
>                 <div class="input-group"
>
> data-format-url="/harbour/movement/create.scheduledtime:format?t:ac=Dashboard"
>
> data-parse-url="/harbour/movement/create.scheduledtime:parse?t:ac=Dashboard"
> data-component-type="core/DateField"><input
> placeholder="scheduled time of movement (&quot;dd mmm yyyy
> hh:mm&quot;)" data-required-message="You must provide a
> value for Scheduled Time." data-optionality="required"
> data-validation="true" value="" id="scheduledTime"
> name="scheduledTime" class="form-control"
> type="text"></input><span class="input-group-btn"><button
> alt="[Show]" class="btn btn-default" type="button"><span
> class="glyphicon
> glyphicon-calendar"></span></button></span></div>
>             </div>
>         </div>
>
>         <input value="Create Movement" class="opto-button
> create-movement-btn" type="submit"></input>
>     </form>
>
>
> **THIS DATEFIELD'S DATEPICKER FAILS**
>
> <div data-container-type="zone" id="filterZone">
>
>     <form class="filter-container" data-async-trigger="true"
> data-validate="submit"
> action="/harbour/dashboard.movementpanel.filterpane.filterform"
> method="post" id="filterForm">
>         <input value="movementZone" name="t:ac" type="hidden"><input
>
> value="Uf5iT4YCrKb6BK/NRv8EvGKwvuI=:H4sIAAAAAAAAAL2UPWgUQRTHXyJRyGEQQS1sLCIS8SZ3eCdBEQneXRSOVW4vShphdnfusjI7M868TU4EawsbKztBsPOj0MIuRVJIrrBR7AVbQQxYGXDGFS0EuV04m/l+7/ef9x7v2WeYWq9AuUHNaiCpjs4mco0lTKCignHSizky7dYkoQPNTMrRgNGwIHWfUEXDVUaQKmZQ366TUGrG48DOiZLCejGkQ6NYLmmZqlmfYaoeVDZOvZrZ2ZyEiTaUQilQS+7RhCEcbN+ka3SeU9Gf91HHon9uoBCmLbmTkQtJrRWQWh0OhsOX/u7GJMBArZ+EEyNguZTKAcmowLY1mK2Xr2x/mIM72+NHVVc+Pd/pvX73uAjKy4WyCUN75SNF1tIy8d0uushj++Qa5SkrP9x8fw+O7f6qgz8Xt+AuTLi87+k2vbGGo/ZV9eaWDj+9kD8cTuQ0wt7u9abXXclj6ixnirCmWpdb/wm179Ky1+g0G+OF5U3XmcqBLws3ntw/n6XrNFRGQLnBINUY2UJ0zPo/mQE1jCwG9pCG2IoZj7KudXx5q/Tx0Jvvf3Wt39W635F8R2pYUlF1i3nVXdUyZMb4aZDExsRSbL2Iar1vj95mQaoCGVEGE1Emwv3oCELJHTZF9PM3+d04L0d/AJVBrr9eBgAA"
> name="t:formdata" type="hidden">
>         <div class="filter-date">
>             <label for="paneStartDate" class="control-label">Start</label>
>             <div class="input-group"
>
> data-format-url="/harbour/dashboard.movementpanel.filterpane.panestartdate:format?t:ac=movementZone"
>
> data-parse-url="/harbour/dashboard.movementpanel.filterpane.panestartdate:parse?t:ac=movementZone"
> data-component-type="core/DateField"><input placeholder="dd
> mmm yyyy hh:mm" value="" id="paneStartDate"
> name="paneStartDate" class="form-control" type="text"><span
> class="input-group-btn"><button alt="[Show]" class="btn
> btn-default" type="button"><span class="glyphicon
> glyphicon-calendar"></span></button></span></div>
>         </div>
>         <div class="filter-apply"><input value="Apply Filter" class=""
> type="submit"></div>
>     </form>
>
> </div>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
Thanks Chris.

What puzzled me about the absent closing </input> tag is that it appears
in the first example above, but not the second.  Yet this markup is
generated by the same DateField component (line 276 to be precise:
"writer.end()").

I searched the web for alternative 'date pickers'.  Bootstrap provides
one, and jQuery another.  Else Thiago's solution of employing browsers'
native datepickers through plain HTML5 may be the better approach.  With
the improvement in browsers since 2005 - when WebFX DatePicker was the
rage - it may be the right time to step away from 3rd party solutions.

Thiago, are you happy to release the DateField you wrote?  I could look at
modifying it to include both date and time, then present it as a complete
replacement to Tapestry's DateField.

Regards,

Chris.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
On second thoughts, producing a new DateTimeField component is probably
wiser.

I'm impressed by the HTML5 "datetime-local" input type.  Browsers that
don't support it should gracefully degrade to plain textfield.

A DateTimeField component based on this HTML5 element would be lighter
weight than the existing DateField component, as there would be no need
for server round trips to wire the field and picker.  Dates would be
formatted and parsed on component rendering and submission only.

What do you think?

Regards,

Chris.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
I'm still waiting for my bosses to release the Html5DateField we have in
our projects . . .

On Thu, Dec 6, 2018 at 9:44 PM Christopher Dodunski <
[hidden email]> wrote:

> On second thoughts, producing a new DateTimeField component is probably
> wiser.
>
> I'm impressed by the HTML5 "datetime-local" input type.  Browsers that
> don't support it should gracefully degrade to plain textfield.
>
> A DateTimeField component based on this HTML5 element would be lighter
> weight than the existing DateField component, as there would be no need
> for server round trips to wire the field and picker.  Dates would be
> formatted and parsed on component rendering and submission only.
>
> What do you think?
>
> Regards,
>
> Chris.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>

--
Thiago
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
In reply to this post by Christopher
Hello, Christopher!

I got tired of waiting for my bosses and I had to release Tapestry 5.4.4
anyway (see the vote thread on the Tapestry dev mailing list for more
details) so I decided to rewrite it from scratch to be included in this
release. Please take a look. :)

On Thu, Dec 6, 2018 at 9:44 PM Christopher Dodunski <
[hidden email]> wrote:

> On second thoughts, producing a new DateTimeField component is probably
> wiser.
>
> I'm impressed by the HTML5 "datetime-local" input type.  Browsers that
> don't support it should gracefully degrade to plain textfield.
>
> A DateTimeField component based on this HTML5 element would be lighter
> weight than the existing DateField component, as there would be no need
> for server round trips to wire the field and picker.  Dates would be
> formatted and parsed on component rendering and submission only.
>
> What do you think?
>
> Regards,
>
> Chris.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>

--
Thiago
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Christopher
In reply to this post by Christopher
Hi Thiago,

Great, I'll take a look.  Meanwhile, because of working to a deadline,
last weekend I developed my own, and was just about to offer it to the
Tapestry community.  But maybe there's no need now?

I based it on HTML 5 datetime-local.  The various browser implementations
of this element aren't consistently good, but slowly improving.

Regards,

Chris.


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away." - Antoine de Saint-Exupéry.
Reply | Threaded
Open this post in threaded view
|

Re: DateField behaviour when within a zone

Thiago H de Paula Figueiredo
On Tue, Dec 11, 2018 at 8:14 AM Christopher Dodunski <
[hidden email]> wrote:

> Hi Thiago,
>

Hello!


> Great, I'll take a look.  Meanwhile, because of working to a deadline,
> last weekend I developed my own, and was just about to offer it to the
> Tapestry community.  But maybe there's no need now?
>
> I based it on HTML 5 datetime-local.  The various browser implementations
> of this element aren't consistently good, but slowly improving.
>

Awesome! Thanks! Well, take a look at the one I did and let me know whether
it's what you need. I tested datetime-local in a couple desktop browsers
but I've found it seriously lacking, so I just implemented a component
using type="date", which is widely supported.


>
> Regards,
>
> Chris.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>

--
Thiago