1

我正在尝试实现这个选择的经典功能：元素依赖于另一个选择：使用提升的选择，例如选择国家并获取所选国家的可能状态。

我面临的问题是，我在 select 元素的 onchange 中的“this.myForm.submit()”没有触发 ajax 请求。如果我使用输入类型“提交”，它会完美运行。

这种行为与 Lift 框架有关吗？有没有更好的方法来使用 Lift 库来实现这种功能？

相关的截断代码：

"name=distributionPoints" #> SHtml.select(distributionPoints, Empty, selectedDistributionPoint = _, "id" -> "the_distributionPoints") &
        "name=devices" #> (SHtml.select(devices, Empty, selectedDevice = _, "id" -> "the_devices")  ++ SHtml.hidden(process))

视图html：

<form class="lift:form.ajax">
<select name="distributionPoints" id="the_distributionPoints" onchange="submit()">
                    <option></option>
                </select>
                <br/>
                Device:
                <select name="devices" id="the_devices">
                    <option></option>
                </select>
</form>

呈现的 HTML：

    <form id="F391649920812YBACEZ" action="javascript://" onsubmit="liftAjax.lift_ajaxHandler(jQuery('#'+&quot;F391649920812YBACEZ&quot;).serialize(), null, null, &quot;javascript&quot;);return false;">
                <div>  
Punto de distribución:
                <select onchange="submit()" id="the_distributionPoints" name="F630704816482OLP514"></select>
                <br />              
                    Equipo:
                    <select name="F391649920817BLRJW5" id="the_devices"></select><input type="hidden" name="F391649920818HPS35E" value="true" />
                    <br />

                </div>
            </form>

[编辑]

我终于得到了解决方案。就像克里斯提到的那样，我使用 ajaxSelect 而不仅仅是选择，而不是使用 setHtml 有一个名为 JsCmds.ReplaceOptions 的方法，它完全符合我的要求。

4

1 回答 1

2

您应该了解，当使用 Ajax 提交时，页面不会重新加载。所以我建议你JsCmds.setHtml在服务器端使用来“重置”第二个选择元素。

所以，实际上第一个选择是一个 ajaxSelect，它是为了修改第二个（所以我认为它不关心隐藏的提交）。当第一个选择被改变时，第二个选择被更新，使用'selectPoint(s)'

一段Scala代码

def selectPoint(s):JsCmd = {
  selectedDistributionPoint = s; 
  newDevices:List[String] = findCorrespondingDevices(s);
  JsCmds.setHtml("name=devices", SHtml.select(newDevices, Empty, selectedDevice = _, "id" -> "the_devices")) ++ SHtml.hidden(process)) 
}

"name=distributionPoints" #> SHtml.AjaxSelect(distributionPoints, Empty, s=> selectPoint(s), "id" -> "the_distributionPoints") &
"name=devices" #> (SHtml.select(Nil, Empty, selectedDevice = _, "id" -> "the_devices")  ++ SHtml.hidden(process))

一段模板代码

<input name="distributionPoints" id="the_distributionPoints" onchange="submit()"/>
<input name="devices" id="the_devices"/>
于 2012-05-29T21:30:47.217 回答