Make ajaxEditable display a configurable ...loading... message instead o... #1246

Closed
wants to merge 3 commits into
from
@@ -472,7 +472,8 @@ trait SHtml {
* () => { println("submitted"); Noop })
* </pre>
*/
- def ajaxEditable (displayContents : => NodeSeq, editForm : => NodeSeq, onSubmit : () => JsCmd) : NodeSeq = {
+ def ajaxEditable (displayContents : => NodeSeq, editForm : => NodeSeq, onSubmit : () => JsCmd,
+ loadingContents: => NodeSeq = Text("...loading...")) : NodeSeq = {
import net.liftweb.http.js
import js.{jquery,JsCmd,JsCmds,JE}
import jquery.JqJsCmds
@@ -486,31 +487,41 @@ trait SHtml {
def swapJsCmd (show : String, hide : String) : JsCmd = Show(show) & Hide(hide)
- def setAndSwap (show : String, showContents : => NodeSeq, hide : String) : JsCmd =
- (SHtml.ajaxCall(Str("ignore"), {ignore : String => SetHtml(show, showContents)})._2.cmd & swapJsCmd(show,hide))
+ def setAndSwap (show : String, showContents : => NodeSeq, hide : String,
+ showLoadingContents: => Box[NodeSeq] = Empty) : JsCmd = {
+ (replacementCmd (show, showContents) &
+ (showLoadingContents.map(SetHtml (show, _) ) openOr Noop ) ) &
+ swapJsCmd(show,hide)
+ }
+
+ def replacementCmd(where:String, what: => NodeSeq) = {
+ SHtml.ajaxCall(Str("ignore"), {ignore : String => SetHtml(where, what)})._2.cmd
+ }
def displayMarkup : NodeSeq =
displayContents ++ Text(" ") ++
- <input value={S.??("edit")} type="button" onclick={setAndSwap(editName, editMarkup, dispName).toJsCmd + " return false;"} />
+ <input value={S.??("edit")} type="button" onclick={
+ setAndSwap(editName, editMarkup, dispName, Full(loadingContents)).toJsCmd + " return false;"} />
def editMarkup : NodeSeq = {
val formData : NodeSeq =
editForm ++
- <input type="submit" value={S.??("ok")} /> ++
- hidden(onSubmit) ++
- <input type="button" onclick={swapJsCmd(dispName,editName).toJsCmd + " return false;"} value={S.??("cancel")} />
+ <input type="submit" value={S.??("ok")} /> ++
+ hidden(onSubmit) ++
+ <input type="button" onclick={
+ swapJsCmd(dispName,editName).toJsCmd + " return false;"} value={S.??("cancel")} />
ajaxForm(formData,
- Noop,
- setAndSwap(dispName, displayMarkup, editName))
+ Noop,
+ setAndSwap(dispName, displayMarkup, editName, Full(loadingContents)))
}
<div>
<div id={dispName}>
{displayMarkup}
</div>
<div id={editName} style="display: none;">
- {editMarkup}
@georgkoester
georgkoester Mar 26, 2012

EditMarkup inserted the form which is shown right after a user clicks 'edit' - bad luck, this form will be replaced by the return from the server...

+ {Text("This site requries javascript")}
</div>
</div>
}