search

aaronc / freactive

High-performance, pure Clojurescript, declarative DOM library
http://documentup.com/aaronc/freactive
Eclipse Public License 1.0
387 stars 27 forks source link

drag and drop attributes not working #25

Closed sveri closed 9 years ago

sveri commented 9 years ago

Hi,

I am trying to get drag and drop working with freactive, but have no success so far. This is the code:

(defn drag-start [e]
  (println "fooo"))

(defn csv-view-table [struct]
  [:div
   [:h2 "Structure"]
   [:table {:class "table table-bordered"}
    [:thead [:tr
         (for [col (first (:content struct))]
           [:td [:div {:draggable     true
                  :ondragstart (fn [e] (println "foo"))
                  ;:ondragstart drag-start}
                 col]])]]
[:tbody
 (for [row (rest (:content struct))]
   [:tr
    (for [col row]
      [:td col])])]]])

While draggable true works, as I can start dragging the div, the ondragstart throws this exception: Uncaught SyntaxError: Unexpected token ( here: <!DOCTYPE html>

Calling a predefined function like this: ondragstart drag-start} Just does nothing.

I can provide more information if needed.

aaronc commented 9 years ago

You commented out the closing } of your attribute map ;)

Try:

 [:td [:div {:draggable     true
                  :ondragstart (fn [e] (println "foo"))
                  ;:ondragstart drag-start
}
                 col]])]]
sveri commented 9 years ago

This is just a copy and paster error. Sorry for confusing things. The code compiles fine on my side and paredit shows no errors neither.

aaronc commented 9 years ago

Okay, also the event handler should be :on-dragstart. Event handlers should always be prefixed with :on- and then have the exact name of the DOM event.

aaronc commented 9 years ago

Setting :ondragstart will set a DOM attribute (which will be parsed as javascript - thus the syntax error), not add an event listener.

sveri commented 9 years ago

Thank you, it works with :on-dragstart. I am pretty sure I tried that before, however, it seems like some weird state was left in the browser, making it not work. Thank you very much :-)

aaronc commented 9 years ago

You're welcome!

martinklepsch commented 9 years ago

@sveri @aaronc It'd be really great if things like this would end up in an example dir in the project. I tried reactive a few days back and had a really hard time because it's been hard to find any code to look at to figure out how to do stuff :)

aaronc commented 9 years ago

Hi Martin, I'd really love to have some more example projects - ideally ultimately there will be a step-by-step tutorial... My bandwidth is pretty full for the next couple weeks and my first priority for freactive is making sure all the essential features are implemented, debugged & documented. So, if anybody else wants to post any examples they got working - maybe some gists, that'd be great... Maybe early 2015, I can work on some sort of tutorial.