JsExp(it) appearing in result list instead of item value

[Hani Massoud]

I need help with the example in section 10.6 A Recap, please.

I created a project to run the code and expected that when I search
for a name in the list I would see the name displayed in the
"items_list" div. However, instead of seeing the name displayed in the
list, I see "JsExp(it)" in the list.

For example, when I search for "d" I see two "JsExp(it)" entries in
the list (I assume one is for "derek" and the other is for "dave").

How can I get the names to display in the list, instead of the
"JsExp(it)"?

Many thanks in advance for your help.


Background Info
I am using lift version 2.4-M3 and scala version 2.9.0-1.

Book Reference: http://exploring.liftweb.net/master/index-10.html
(section 10.6 at end of page).

Here is the relevant code from my project:

1. search.html
<lift:surround with="default" at="content">
<lift:Hello.ajaxian>
<text:show/>
</lift:Hello.ajaxian>
<div id="items_list" style="width: 300px; height: 100px; overflow:
auto; border: 1px solid black;">
</div>
</lift:surround>

2. Hello.scala snippet

class Hello {

val names = "marius" :: "tyler" :: "derek" :: "dave" ::
"jorge" :: "viktor" :: Nil

def ajaxian(html: Group) : NodeSeq = {
bind("text", html,
"show" -> ajaxText("Type something", {value => {
val matches = names.filter(e => e.indexOf(value) > -1)
SetHtml("items_list", NodeSeq.Empty) &
JsCrVar("items", JsArray(matches.map(Str(_)):_*)) &
JsCrVar("func", Jx(<ul>{
JxMap(JsVar("it"), Jx(<li><a
href="">{JsVar("it")}</a></li>))}</ul>).toJs) &
(ElemById("items_list") ~> JsFunc("appendChild",
Call("func", JsVar("items"))))
}})
)
}

[altmattr]

You have found a bug in Jx

https://groups.google.com/d/topic/liftweb/OXuRqohI6Us/discussion

It seems Jx has reached the end of its life, I can't imagine this bug will be fixed.

Authors: might be time to remove that section of the book. This will shrink the JavaScript chapter significantly, allowing you to combine it with the Ajax chapter. I think it all makes more sense that way.

[altmattr]

btw: you can still make that example work, just use normal xml instead of Jx.  There is nothing in that example that _requires_ the dom fragment to be built client-side.

I modified the lift_basic template to have some javascript examples, including a broken and a working version of the code you are working on

https://bitbucket.org/altmattr/exploring_javascript_lift/src/44975d609855/src/main/scala/code/snippet/HelloWorld.scala

Look down the bottom of that class and there are two versions of ajaxian.  The first one fails with the behaviour you have noticed and the second one works perfectly (and is simpler).

Matt