Question

我有一个链接到远程源的枚举字段，当您在该字段中键入时，远程源提供匹配，弹出就像您期望的那样。它很棒。但我需要那个领域是一个形式。问题是当它处于形式时它不再有效。我删除了代码并将其列在下面。希望下面的代码足够，但您可以单击提供的链接进行尝试，并查看未来几周左右的源代码。

任何人都可以解释如何使其在表单中工作吗？

此代码有效（try it here）：

<html>
<head>
    <title>Remote Source Enum</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://rawgit.com/vitmalina/w2ui/master/dist/w2ui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://rawgit.com/vitmalina/w2ui/master/dist/w2ui.min.css" />
</head>
<body>
<div class="w2ui-field"><label>Name Picker:</label><div> <input id="tcidPicker"></div></div>
<script>
$('#tcidPicker').w2field('enum', {
    url: '/v1/transactantstd/ISO',
    renderItem: function (item) {return item.FirstName + ' ' + item.LastName; },
    renderDrop: function (item) {return item.FirstName + ' ' + item.LastName; },
    compare: function (item, search) {
        // ... lines removed for brevity ...
    }
});
</script>
</body>
</html>

此代码不起作用（try it here）：

<html>
<head>
    <title>Remote Source Enum in a Form</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://rawgit.com/vitmalina/w2ui/master/dist/w2ui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://rawgit.com/vitmalina/w2ui/master/dist/w2ui.min.css" />
</head>
<body>
<div id="form">
    <div class="w2ui-field">
    <label>Name Picker:</label><input id="tcidPicker" name="tcidPicker">
    </div>
</div>
<script type="text/javascript">
$(function () {
    $('#form').w2form({ 
        name  : 'form',
        fields: [
            { field: 'tcidPicker', 
                type: 'enum', 
                url: '/v1/transactantstd/ISO',
                renderItem: function (item) {return item.FirstName + ' ' + item.LastName; },
                renderDrop: function (item) {return item.FirstName + ' ' + item.LastName; },
                compare: function (item, search) {
                    // ... lines removed for brevity
                },
            },
        ],
    });
});
</script>
</body>
</html>

Answer 1

您需要将选项包装在options属性中。

请参阅：http://w2ui.com/web/docs/1.5/w2form.fields

在你的情况下：

    fields: [
        { field: 'tcidPicker', 
            type: 'enum', 
            options: {
                url: '/v1/transactantstd/ISO',
                renderItem: function (item) {return item.FirstName + ' ' + item.LastName; },
                renderDrop: function (item) {return item.FirstName + ' ' + item.LastName; },
                compare: function (item, search) {
                    // ... lines removed for brevity
                },
            },
        },
    ],

表格

1 个答案: