I'm trying to build a simple search application as an learning experiment with Comet and the Lift Framework. The plan is to have a page with a text entry and space for search results. When a search term is entered, it should be transmitted as an ajax request and the results should be pushed back by the server and rendered on the same page. When the server finds more results, they should be pushed to the client.
Using the Comet Chat Demo as template, I have a CometActor that renders both an ajax form and the search results from the following template:
<lift:comet type="SearchResults" name="Other">
<search:input><search:input /><input type="submit" value="Search" /></search:input>
<search:results>
<div>Results for: <search:tag /></div>
<div class="search-results">
<search:list>
<li><list:title /></li>
</search:list>
</div>
</search:results>
</lift:comet>
The corresponding SearchResults actor renders this in two parts: fixedRender
generates the ajax form and render
is responsible for rendering the search results.
class SearchResults extends CometActor {
override lazy val fixedRender: Box[NodeSeq] = {
SHtml.ajaxForm(bind("search", findKids(defaultXml, "search", "input"),
"input" -> SHtml.text("", updateSearch _)))
}
private def updateSearch(tag: String) = Log.info("UpdateSearch: " + tag)
def render = {
bind("search", findKids(defaultXml, "search", "results"),
"tag" -> "MyTag", // TODO show actual search tag
"list" -> <ul><li>Entry</li></ul>) // TODO actual search results
}
}
In principle this code works, but it renders the search box below the results not on top where I would expect it.
I assume, this has to do with the oder in which render
and fixedRender
are executed. How can change this code to have the search box at the top?