如何使用 devexpress 和 knockout.js 创建提交按钮？

Question

所以我有一个应用程序可以显示一个人的开支。我制作了添加新费用的视图，但我不知道如何制作保存按钮，以便将费用保存在数据库中并重定向到费用列表。

视图有很多这样的字段：

    <div id="selBxChSt" data-bind="dxLookup: {
        dataSource: dsExpenses,
        valueExpr: 'NAME',
        displayExpr: 'NAME',
        title: 'Expense',
        searchEnabled: true,
        value: selectedExpense
        }">
    </div>

不仅是dxLookup，还有dxTagBox、dxDateBox和dxTextArea。

我制作了重置按钮，将所有字段设置为默认值。但是我不知道如何将它们保存到火鸟数据库中。

这是按钮的 html：

<div class="Column" data-bind="dxButton: {icon: 'todo', text: 'Save', type: 'normal', onClick: expenseSave}"></div>

所以现在我必须在 knockoutJS 中创建一个函数来保存用户从查找中选择的所有内容。

我不知道该怎么做，我是 knockout.js 和 devexpress 的新手，所以任何想法或提示都会很棒，谢谢！

Answer 1

要实现向服务器端提交数据的 "old-school" 表单，请按以下方式进行：

用form标签包裹所有编辑器和提交按钮。
为 dxButton 使用 useSubmitBehavior 选项。
为编辑器设置 name 选项。

您的代码应如下所示：

<form action="your-action" method="post" data-bind="event: { submit: onFormSubmit }">
    <div data-bind="dxTextBox: { name: 'login' }"></div>
    <!-- other editors... -->
    <div data-bind="dxButton: { text: 'Submit', useSubmitBehavior: true }"></div>
</form>

查看模型：

viewModel.onFormSubmit = function() {
    // Here you can implement a custom logic before submit. Validate editors, for instance.
};

也请参考此 sample。

如何使用 devexpress 和 knockout.js 创建提交按钮？

How do I make a submit button using devexpress and knockout.js?

javascript

devexpress

submit

knockout.js

devextreme