All geek questions in one place

How to update HTML class from CometActor

In response to some asynchronous event on the server, I want to update the HTML node class to reflect its updated status. I know the node identifier and the class I want to change it to. Which JsCmd do I need to use to update the class? In general, where can I find a good link to JsCmd and what do they do?

A simple example:

case class UpdateClass(id: String, htmlClass: String)

class ClassUpdater extends CometActor {
  override def lowPriority: scala.PartialFunction[scala.Any, scala.Unit] = {
    case UpdateClass(id, htmlClass) =>
      partialUpdate(Noop /* now what? */)
  }

  def render = NodeSeq.Empty
}

So, if I had HTML:

<html><body>
<lift:comet type="ClassUpdater"/>
<div id="foo" class="bar">insert text here</div>
</body></html>

If I sent a message UpdateClass("foo", "baz")to mine ClassUpdater, I want my class to divchange to baz.

+3
source share
2 answers

Edit: I found a better way to do this. Old code is now more for more complex things.

, jQuery:

SetElemById("foo", JE.Str("baz"), "className")

JavaScript

document.getElementById("foo").className = "baz";

, JE.Str("baz") JsExp, -

SetElemById("foo", JE.Str("baz"), "firstChild", "className")

. (.: SetElemById)

JsCMD , .

- , . jQuery, #oldId newClass.

  case class ChangeClassAtId(oldId: String, newClass: String) extends JsCmd {
    def toJsCmd = """try {
      $(""" + ("#" + oldId).encJs + """).attr("class", """ + newClass.encJs + """);
    } catch (e) {}"""
  }

:

case class ChangeClass(oldClass: String, newClass: String) extends JsCmd {
    def toJsCmd = """try {
      $(""" + ("." + oldClass).encJs + """).each(function(){
          $(this).addClass(""" + newClass.encJs + """).removeClass(""" + oldClass.encJs + """);
        });
    } catch (e) {}"""
  }

Noop, .

+4

- . div.

: http://github.com/lift/lift/blob/master/examples/example/src/main/scala/net/liftweb/example/comet/Clock.scala

- :

case UpdateClass (id, htmlClass) = > partialUpdate (SetHtml (id, Text ( " " )))

0

Source: https://habr.com/ru/post/1772499/

More articles:


All Articles