Fork me on GitHub
#reagent
<
2016-02-05
>
shriphani06:02:33

hi does anyone know how I can specify a custom property for a reagent component? I have a [:input and I want to set a .autocomplete property on it. Whatever I do, it is set as a string "[object Object]”. What am I missing ?

slotkenov08:02:09

@shriphani: [:input {:autocomplete true}]?

shriphani08:02:58

[:input {:autocomplete {:source list-name}}]

shriphani08:02:23

I’ve tried several variants: putting that dict in clj->js, #js etc.

slotkenov08:02:51

its translated to html, you can’t set a js object as value for an html attribute

slotkenov08:02:38

or maybe like <input autocomplete=“javascript: {source: [1, 2, 3]}”>?

cjmurphy08:02:28

[:input #js {:autocomplete #js {:source list-name}}]

shriphani09:02:54

@cjmurphy: I have a bunch of other keys like :on-change on my [:input as well

shriphani09:02:50

that’s what my :input looks like

cjmurphy09:02:45

See this SO question http://stackoverflow.com/questions/34439916/syntax-for-giving-a-button-a-particular-width for why you have to put #js before every hash-map. Also in troublesome spots clj->js is just easier.

cjmurphy09:02:46

Actually I don't even know if you need to do that sort of thing (`clj->js`) with hiccup. I am probably not helping.

mccraigmccraig09:02:59

@cjmurphy: no need for #js with reagent

mccraigmccraig09:02:01

@shriphani: is it just your :autocomplete attr which isn't rendering ? i.e. are your :on-change handlers being called correctly etc

shriphani09:02:37

everything else is a peach

shriphani09:02:58

if I make an attr :autocomplete I get a warning suggesting I am looking for :autoComplete

shriphani09:02:07

both attrs have the wrong key.

shriphani09:02:52

I mean wrong val

mccraigmccraig09:02:21

@shriphani: hmm my next guess was react didn't support 'autoComplete' attr, react docs say it is supported http://facebook.github.io/react/docs/tags-and-attributes.html so i dunno

shriphani09:02:36

ah I see wow that is why

shriphani09:02:47

so I was trying to use autocomplete to get jquery’s typeahead working

shriphani09:02:10

but I guess react only emits a string.

shriphani09:02:25

which brings me back to the first question - how do I make this thing work ...

mccraigmccraig09:02:41

i thought autoComplete attr value was an "on" or "off" string ? what are you wanting it to be ?

shriphani09:02:54

jquery’s typeahead wants it to be a list

shriphani09:02:58

of potential entries...

shriphani10:02:56

ah I guess I can use component-did-mount.

shriphani10:02:06

it is 2:00am, I’ll fight that battle tomorrow. Thanks for the help @mccraigmccraig and others simple_smile.

alex-eberts23:02:44

Hi folks - I’m using re-com on a project and we’re going to need a something like DataTables (https://datatables.net/) What are people using to do this in reagent / re-com?

jaen23:02:54

https://facebook.github.io/fixed-data-table/ and http://adazzle.github.io/react-data-grid/ are two React-compatible choices that come to mind. Haven't used either of those though, so can't comment how nice they are (or not) in practice.

alex-eberts23:02:37

thanks @jaen - I’ll check them out…