SPA (Single Page Application) demo with scala-js and scalatags. Live http://www.scala-js-fiddle.com/gist/0fbfc1a74a4f91e033e531a68012e145

Main.scala

// See http://www.lihaoyi.com/hands-on-scala-js/#Scalatags

import org.scalajs.dom
import dom.html
import scalajs.js.annotation.JSExport

object ScalaJSExample extends js.JSApp {
 val document = js.Dynamic.global.document

  def main() = {
    println(div(
      h1("Search Box!"),
      p("Type here to filter the list of things below!"),
      div(box),
      output).render)
  }

  val listings = Seq("Apple", "Apricot", "Banana", "Cherry", "Mango", "Mangosteen", "Mandarin", "Grape", "Grapefruit", "Guava")

  val box = input(
    `type` := "text",
    placeholder := "Type here!").render

  val output = div(renderListings).render

  box.onkeyup = (e: dom.Event) => {
    output.innerHTML = ""
    output.appendChild(renderListings)
  }

  def renderListings = ul(
    for {
      fruit <- listings
      if fruit.toLowerCase.startsWith(box.value.toLowerCase)
    } yield {
      val (first, last) = fruit.splitAt(box.value.length)
      li(
        span(
          backgroundColor := "yellow",
          first),
        last)
    }).render
}