在 LightSwitch HTML 客户端中将 TextBox 控件的绑定目标更新为 PropertyChanged (keydown)

Question

我们正在使用 Visual Studio LightSwitch HTML 客户端，在某些情况下，我们希望在文本输入到 TextBox 控件而不是控件的 LostFocus 时更新绑定目标。

这与使用XAML UpdateSourceTrigger.PropertyChanged rather than UpdateSourceTrigger.LostFocus 的方式类似。

实现这个的选项/推荐方法是什么？

Answer 1

我们最终使用以下代码模式以适合我们要求的方式解决此问题：-

myapp.AddEditCustomer.Name_postRender = function (element, contentItem) {
    contentItem.dataBind("_view.isRendered", function (isRendered) {
        if (isRendered) {

            var tb = contentItem._view.underlyingControl;
            tb.getView().on("keyup", ".id-element", null, function (e) {
                tb.text = tb._textElement.val();
            });

            contentItem.dataBind("value", function (value) {
                // Use the toastr library from nuget (http://www.nuget.org/packages/toastr)
                // in order to display the value of the updated binding target 
                // and demonstrate that the update occurs on PropertyChanged 
                toastr.info("value [" + value + "]"); 
            });
        }
    });
};

通过使用 keyup 处理程序（针对底层文本框控件的输入元素添加），这种方法会在释放键后强制绑定目标进行更新。一旦文本框控件完成呈现，就会附加 keyup 处理程序。

上面的例子使用了优秀的 toastr JavaScript 库 (codeseven.github.io/toastr)，它可以使用相关的 NuGet 包 (toastr) 安装在 Visual Studio 中。