Question

好的，首先，让我们从我开始承认上周绑定Lift形式的绑定（...）方式是所以！ :)我知道，我还没有回去更新这段代码。此外，我现在相信，有一些非常光滑的Lifty方式来做到这一点。这就是我所寻求的。我甚至难以理解如何一起破解某些东西。那说......

我有一个项目列表，我最初显示不可编辑，每个项目的标题是一个启用ajax的链接，调用服务器并用该项目的可编辑形式替换该行项目（我使用SetHtml用于交换列出该Item的＆lt; li＆gt;中的表单。 “父”项目列表视图看起来像这样

＆LT; form data-lift =“form.ajax”＆gt;
         ＆LT; div data-lift =“creategamewizard？multipart = true”id =“wizardform”＆gt;
             ＆LT; UL＆GT;
             ＆LT; li＆gt;项目1＆lt; /立GT;
             ＆LT; li＆gt;项目2＆lt; /立GT;
             ＆LT; / UL＆GT;
             一些更多的形式元素
             ＆LT;按钮＆GT;提交＆LT; /按钮＆GT;
             ＆LT; input type =“hidden”id ='298356928734'/＆gt;
         ＆LT; / DIV＆GT;
     ＆LT;形式＆GT;

这个ajax提交（通过隐藏字段）调用processSubmit（）。

以editableItem形式交换的SetHtml看起来像这样注意：在下面的列表的末尾，“保存”绑定没有绑定它的服务器端代码，因为“父”提交按钮已经在页面上，当我在此绑定中放入另一个隐藏字段或尝试将任何代码直接绑定到“编辑项目保存”按钮，该代码和“父”提交已被触发。因此，下面的方法是尝试使用“父”提交进行父提交以及编辑项提交。

<a href="javascript://" onclick={ajaxOnClickHandler(editItemClickHandler(item.id.get))}>{item.title.get}</a>

def ajaxOnClickHandler(jsHandler: ()=>JsCmd) =
{
    SHtml.onEvent( e => jsHandler()).toJsCmd+";return false;"
}
def editItemClickHandler(itemId: String): ()=>JsCmd = ()=>
{
    trace.logAjaxComm("ExistingItem.Edit()")
    JsCmds.SetHtml("LiId"+itemId, getEditableItem(promo) )
}
def getEditableItem(itemId) =
{
    bind( ...
        "promotitle" -> SHtml.text(editablePromo.get.promotitle.is,
        (s:String) => {
            trace.logUIDataManipulation("Saving new promo Title["+s+"]");
            editablePromo.get.promotitle(s)
        }, "id" -> "promotitle"),
        "save" -> SHtml.button("Save", ()=> {})
    )
}

然后，当用户选择一个Item，并且插入了可编辑的Item表单时，有另一个“另一个”提交按钮，该按钮应该ajax提交该项目的表单数据，然后交换回（现在更新的）nonEditable版本数据。

我的问题是提交。除了上面的编辑项目表单，我在“父”不可编辑列表页面上有一个ajaxified提交按钮，用于处理提交列表下方的一些字段。编辑项目“保存” - ＆gt;绑定添加一个按钮，它应该（实际上）不为自己做任何事情，但它会触发“父”提交按钮。然后我将该提交路由到保存编辑项表单。

不可编辑的项目和可编辑的项目代码交换正常，但是不会保存在可编辑项目表单中所做的更改，我发现这是因为可编辑项目表单中的元素根本没有提交，以下是我根本看不到的日志消息示例......

bind( ... "promotitle" -> SHtml.text(editablePromo.get.promotitle.is,
    (s:String) => {
        trace.logUIDataManipulation("Saving new promo Title["+s+"]");
        editablePromo.get.promotitle(s)
    }, "id" -> "promotitle")
)

在正常的ajaxified形式中，所有元素处理程序都被调用（如果字段有变化，我猜......）按渲染顺序，最后调用提交/隐藏元素的处理程序（如果它们是最后在绑定列表中。

最后，让我们来看看我的问题：如果您正在进行这样的就地编辑，我该如何管理2个提交按钮（不可编辑列表页面的按钮加上编辑项目时添加的附加按钮）？我确定我不需要刷新页面，但我无法弄清楚你是如何用Ajax做的。或许，就地可编辑形式可以作为非提交的ajax动作提交，即。某种程度上不会触发父提交？

Answer 1

对于任何绊倒这个问题的人，我想我会分享我最终找到的解决方案...

1）问题是在可编辑项目的字段处理程序被调用之前，提交（对于AJAX这是隐藏的html标记）发生了。因此，当将可编辑项目折叠回只是一个不可编辑的列表项目的AJAX更新时，数据尚未更新。因此，以不可编辑的形式显示的内容未显示更新，但如果我在浏览器中刷新页面，则更新已保存到数据库中，现在显示正确。

2）错误排序的原因是Lift为每个表单标签的服务器端处理程序分配一个id（“单调增加”，并在末尾添加一个额外的字符串）。在您对表单执行ajax实时更新并添加字段之前（这与我在插入可编辑项目字段时所做的那样）之间没有问题。这些新添加的字段被分配了服务器端ID，在隐藏字段之后出现，该字段是作为初始页面呈现的一部分生成的。

3）解决方案是使用S.formGroup将隐藏字段显式推送到更高的id。有关详细信息，请参见此处...

下面最后一个链接的示例如下（与我的不同之处在于它使用SHtml.submit，而我使用SHtml.hidden）。它将常量1,000添加到提交按钮的服务器端处理程序ID：

“type = submit”＃＆gt; S.formGroup（1000）{ SHtml.submit（“提交”，流程） }

讨论与我的问题基本相同的问题：https://groups.google.com/forum/#!topic/liftweb/MYJQeVlOYFM
标题为“服务器端功能顺序”的标识赋值和S.formGroup的描述： https://www.assembla.com/spaces/liftweb/wiki/cool_tips
最后，链接到最后一个链接是一些示例代码： https://groups.google.com/forum/#!topic/liftweb/E9z7PVhogQw

在一个页面上提升/处理2个不同表单提交需求中的内联项目编辑

1 个答案: