Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How can I access event.target.value? #158

Open
omefire opened this issue Nov 7, 2018 · 3 comments
Open

How can I access event.target.value? #158

omefire opened this issue Nov 7, 2018 · 3 comments

Comments

@omefire
Copy link

omefire commented Nov 7, 2018

I am using the purescript-react library to create an app.

I am trying to handle an onChange event on an input element:

input [ Props.onChange $ \evt -> do

...

]

I want to access evt.target.value (as I would in Javascript).

Here's what the types look like:

type SyntheticInputEvent = SyntheticEvent_ (SyntheticUIEvent' ( SyntheticEvent' () ))

foreign import data SyntheticEvent_ :: # Type -> Type

type SyntheticUIEvent' r = (detail :: Number, view :: NativeAbstractView | r)

type SyntheticEvent' r = (bubbles :: Boolean, target :: NativeEventTarget, ... | r)

I have tried doing the following:

input [ Props.onChange $ evt -> do

let SyntheticEvent_ (SyntheticUIEvent' { detail: detail, view: view, target: target }) = evt

...

]

But that doesn't work.

Any suggestions?

@ethul
Copy link
Contributor

ethul commented Nov 7, 2018

You should be able to pass the evt right to the target function

target :: forall r. SyntheticEvent_ (target :: NativeEventTarget | r) -> Effect NativeEventTarget
target = get (SProxy :: SProxy "target")

This would give you a NativeEventTarget, which at the moment you can unsafe coerce to get the value property.

Hope this helps.

@natefaubion
Copy link
Contributor

I think NativeEventTarget is technically opaque, since it can vary by platform. I think it'd be worth providing conversions in react-dom though.

@Jwhiles
Copy link

Jwhiles commented Nov 19, 2018

@natefaubion
Would a correct implementation of this look similar to this?

propertyName :: forall r. SyntheticEvent_ (propertyName :: String | r) -> Effect String
propertyName = get (SProxy :: SProxy "propertyName")

I'm happy to make a PR adding it if so.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

4 participants