I have a html page that contains a navigation bar at the top of the screen. In
the navigation bar, I have a search box and what I want it to do is, you type
in this box, hit enter and the results are displayed as a dropdown menu
<li><input type="text" id="search-bar" placeholder="Search"></li>
This is the html search input box. I have given it an id `search-bar` to
eventually create the dropdown menu in ClojureScript
(when-let [section (. js/document (getElementById "search-bar"))]
(r/render-component [search-bar-component] section))
Currently I have a search-form that looks like the following
(defn search-form
[]
[:div
[:p "What are you searching for? "
[:input
{:type :text
:name :search
:on-change #(do
(swap! fields assoc :search (-> % .-target .-value))
(search-index (:search @fields)))
:value (:search @fields)}]]
[:p (create-links @search-results)]])
(defn- search-component
[]
[search-form])
This is my `search-component`.
What I want to happen is when you type in the input box on the navbar (say
"hello", it calls `search-index` from the search-form with the parameter being
the value you type in ("hello") and then returns the results as a dropdown menu
below.
`search-form` works right now as a form on a html page, where you input some
text into a form and then the results are displayed below. I want to change it
to be on the navbar instead of as a separate page, where the input form is on
the navbar and the results are displayed below
How would I have to change my search-form in order to do this?
I think I can do something along the lines of this
(defn search-bar-form
[]
[:div
[:input
{:type :text
:name :search
:on-change #(do
(swap! fields assoc :search (-> % .-target .-value))
(search-index (:search @fields)))
:value (:search @fields)}]
[:p (create-links @search-results)]])
(defn- search-bar-component
[]
[search-form])
Any help would be much appreciated.
--
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 [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/clojurescript.
