some code stories

Add/Edit/Remove items in lift sample

• 1- Create the menu in boot

  in src/main/scala/bootstrap/liftweb/Boot.scala

  
  // List items menu
  val itemsMenu = Menu(Loc("Items", "items" :: "index" :: Nil, "List items"))
  
  // Build SiteMap
  val entries = Menu(Loc("Home", List("index"), "Home")) :: itemsMenu :: Nil
  

• 2- Define the default database
  The properties in src/main/resources/props/default.props with the connection url

  
  db.driver   = org.h2.Driver
  db.url      = jdbc:h2:~/hello_db
  db.user     =
  db.password =
  

  in src/main/scala/bootstrap/liftweb/Boot.scala

  
  
  DB.defineConnectionManager(DefaultConnectionIdentifier, DefaultDBVendor)
  Schemifier.schemify(true, Log.infoF _, Item)
  
  ...
  
  object DefaultDBVendor extends ConnectionManager {
      def newConnection(name: ConnectionIdentifier): Box[Connection] = {
          try {
              val connectionUrl = Props.get("db.url").openOr("") + "?user=" +
                                  Props.get("db.username").openOr("") + "&password=" +
                                  Props.get("db.password").openOr("")
  
              Class.forName(Props.get("db.driver").open_!)
              val dm = DriverManager.getConnection(connectionUrl)
              return Full(dm)
          }
          catch {
              case e: Exception => {
                  Log.error(e.getMessage);
                  return Empty
              }
          }
      }
  
      def releaseConnection(conn: Connection) = conn.close
  }
    
  

• 3- Create items/index.html
  in src/main/webapp/items/index.html

  
  <lift:surround with="default" at="content">
      <ul>
          <lift:adminItems.list>
              <li>
                  <item:name />
              </li>
          </lift:adminItems.list>
      </ul>
  </lift:surround>
  
  

  and snippet in src/main/scala/com/sample/snippet/AdminItems.scala

  
  package com.sample.snippet
  
  import scala.xml.{NodeSeq, Text}
  
  import net.liftweb.util.{Helpers, Log}
  import Helpers._
  
  import com.sample.model.Item
  
  class AdminItems {
  
      def list(node: NodeSeq): NodeSeq = {
          Item.findAll match {
              case Nil   => Text("There is no items in db")
              case items => items.flatMap(i => bind("item", node, "name" -> {i.name}))
          }
      }
  ...
  }
  

• 4- Add item form

  create a template for add/edit items in src/main/webapp/templates-hidden/item_form.html,
  we are going to use the same template for edit and add items,
  using TemplateFinder in AdminItems snippet

  
  <fieldset>
      <legend><itemForm:title /></legend>
      <label for="name">Name</label>
  
      <itemForm:name />
      <itemForm:id />
  
      <itemForm:submit />
  </fieldset>
  
  

  we are going to use two requestvars to decide when to display the edit form or the add form

  
      private object ShowAddItem  extends RequestVar[Int](0)
      private object SelectedItem extends RequestVar[Long](0)
  

  declare a showAddItem and showEditItem function in adminItems snippet

  
      def clear = {
          ShowAddItem(0)
          SelectedItem(0)
      }                  
  
      def showAddItem(node: NodeSeq): NodeSeq = {
          ShowAddItem.get match {                
              case 1 => {                        
                  var name = ""                  
                  val template: NodeSeq = TemplateFinder.findAnyTemplate(ITEM_TEMPLATE :: Nil).openOr(<p></p>)                                                                     
                  val content = bind("itemForm", template, "title"  -> Text("New item"),    
                                                            "name"   -> SHtml.text(name, name = _),                                                                                   
                                                            "id"     -> Text(""),           
                                                            "submit" -> SHtml.submit("save", () => addItem(name)),                                                                    
                                                            "close"  -> SHtml.link("index", () => clear, Text("close")))                                                              
  
                  <div>{content}</div>
              }                       
              case _ => SHtml.link("index", () => ShowAddItem(1), <p>Add</p>)
          }                                                                  
      }                                                                      
  
      def showEditItem(node: NodeSeq): NodeSeq = {
          if (SelectedItem.get > 0) {             
              var id = SelectedItem.get           
              val item = Item.find(id).open_!     
  
              var name = item.name.is
  
              val template = TemplateFinder.findAnyTemplate(ITEM_TEMPLATE :: Nil).openOr(<p></p>) 
              val content  = bind("itemForm", template, "title"  -> Text("Edit item"),      
                                                        "name"   -> SHtml.text(name, name = _),                                                                                       
                                                        "id"     -> Html.hidden(() => {id = id}),                                                                                    
                                                        "submit" -> SHtml.submit("save", () => saveItem(id, name)),                                                                   
                                                        "close"  -> SHtml.link("index", () => clear, Text("close")))                                                                  
  
              <div>{content}</div>
          }                       
          else {                  
              <div></div>
          }                       
      }           
  

  Now we can call the showEditItem and showAddItem snippets functions in items/index view

  
  <lift:surround with="default" at="content">
      <ul>
          <lift:adminItems.list>
              <li>
                  <item:name />
  
                  <item:edit />
                  <item:remove />
              </li>
          </lift:adminItems.list>
      </ul>
  
      <lift:adminItems.showAddItem  form="POST" />
      <lift:adminItems.showEditItem form="POST" />
  </lift:surround>
  
  

  The attribute form=”POST” on the snippet will create a form with method=”POST” automatically arround the snippet content.

  And that’s it, a simple list with liftweb.
  The code can be found on http://github.com/jgoday/sample_lift_testing