add datetimepicker and tagsInput for form input in om with sablono

[Haijin Yan]

Hi,
Just wondering how to add datetimepicker and tagsInput for form input fields ?
I was able to do that previously under Pedestal App. As I am migrating my code to OM, I failed to find example of how to do this under om.

can anybody shed some lights here ?

Thanks,

[Hiram MADELAINE]

Hi,

Did you managed to make it work ?

I am trying to integrate goog.ui.InputDatePicker in Om but I have a trouble with the events.
What I did so far :
In the DidMount phase, I decorate my element using an instance of goog.ui.InputDatePicker. The problem I encounter so far is when I chose a date, the event is triggered with hrs previous value not the one I picked.
I will investigate further this week.

Let me know

Hiram

[Dave Della Costa]

Hi Hiram, I've added an example of one way to do this here:

https://github.com/ddellacosta/om-cookbook/blob/master/datetimepicker/src/core.cljs

Let me know if that helps--

DD

[Hiram MADELAINE]

Hi Dave !

Thank you very much. I am going to study your example.

The difference with the way I try to do it is : 

I have a go loop that capture the onChange event on the date input field. (It seems overkill for one field but my form contains many more)

When I select the date from the inputDatePicker the onBlur event is triggered but the value I receive in the event is the value before the selection, not the one I picked.

If I tab in an other field I eventually get the correct value.

I have the minimum example https://gist.github.com/hiram-madelaine/eac8434d25c3bee31584

--
Note that posts from new members are moderated - please be patient with your first post.
---
You received this message because you are subscribed to a topic in the Google Groups "ClojureScript" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/clojurescript/SLAKBf1TpDM/unsubscribe.
To unsubscribe from this group and all its topics, send an email to clojurescrip...@googlegroups.com.
To post to this group, send email to clojur...@googlegroups.com.
Visit this group at http://groups.google.com/group/clojurescript.

--

Hiram MADELAINE

Eloquent Logic
96, rue La Fayette 75010 Paris
+33 6 11 51 37 71

[Dave Della Costa]

Why don't you directly listen on one of the events that the DatePicker
triggers?

I used goog.ui.DatePicker.Events.CHANGE in my example but
goog.ui.DatePicker.Events.SELECT may be more appropriate. You can find
these synthetic event types buried in Google Closure widget code
(http://docs.closure-library.googlecode.com/git/local_closure_goog_ui_datepicker.js.source.html).
Unfortunately they make it hard to find sometimes, but most widgets
I've used have these events, which you can hook into.

I'm not sure why you're seeing the strange behavior you are seeing, but
it could possibly be related to whatever is happening in the interaction
between React's synthetic events and Google's event system. I would be
cautious about relying too heavily on React's built-in event handlers
when using a Google Closure widget.

DD

(2014/07/01 22:38), Hiram MADELAINE wrote:
> Hi Dave !
>
> Thank you very much. I am going to study your example.
> The difference with the way I try to do it is :
> I have a go loop that capture the onChange event on the date input
> field. (It seems overkill for one field but my form contains many more)
> When I select the date from the inputDatePicker the onBlur event is
> triggered but the value I receive in the event is the value before the
> selection, not the one I picked.
> If I tab in an other field I eventually get the correct value.
>
> I have the minimum example
> https://gist.github.com/hiram-madelaine/eac8434d25c3bee31584
>
>
>
>
> 2014-07-01 13:09 GMT+02:00 Dave Della Costa <ddell...@gmail.com

> <mailto:ddell...@gmail.com>>:

> <mailto:clojurescript%2Bunsu...@googlegroups.com>.

> To post to this group, send email to clojur...@googlegroups.com

> <mailto:clojur...@googlegroups.com>.

> Visit this group at http://groups.google.com/group/clojurescript.
>
>
>
>
> --
> Hiram MADELAINE
> Eloquent Logic
> 96, rue La Fayette 75010 Paris
> +33 6 11 51 37 71
>

> --
> Note that posts from new members are moderated - please be patient with
> your first post.
> ---

> You received this message because you are subscribed to the Google
> Groups "ClojureScript" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to clojurescrip...@googlegroups.com
> <mailto:clojurescrip...@googlegroups.com>.

> To post to this group, send email to clojur...@googlegroups.com

> <mailto:clojur...@googlegroups.com>.

[Dave Della Costa]

I will add that if you listen directly on the InputDatePicker's events,
you can get a Date object back directly when the event is triggered--you
won't have to do the conversion back into a Date from a string value as
you are doing.

DD

[Hiram MADELAINE]

I am currently working on a library that generates automatically an input form based on a prismatic/Schema so I was hoping to follow the same pattern for all types of input.

By the way, It works perfectly well with input type="date"  but only in Chrome. As I target all browsers I am stuck with a more complex solution.

I will try to listen directly to the events of the InputDatePicker.

Thank you very much for your help

To unsubscribe from this group and all its topics, send an email to clojurescrip...@googlegroups.com.
To post to this group, send email to clojur...@googlegroups.com.

Visit this group at http://groups.google.com/group/clojurescript.