javascript - Extjs4 转换组合框不会在表单提交时发送 value 属性

Question

我在 HTML 表单中有一个 ExtJS4 转换组合框:

<script>   

Ext.onReady(function() {
        Ext.tip.QuickTipManager.init();

        var transformed = Ext.create('Ext.form.field.ComboBox', {
            typeAhead: true,
            transform: 'countrySelect',
            forceSelection: true
        });
    });
  </script>


<form>
 <select  id="countrySelect">
      <option value="AR">Argentina</option>

    </select>

当我提交表单时，它发送的是 Argentina 而不是 AR 。我应该怎么做才能让 extjs 发送 value 属性作为所选值？

Answer 1

我了解您希望在不使用 Ext... 的情况下提交表单

给你的组合一个hiddenName ，以便 Ext 创建一个隐藏的输入元素，该元素的值将与组合中选择的值保持同步。

为了防止表单读取可见输入元素的值，您必须删除其 name 属性。

通过您的示例，我们可以得出:

Ext.create('Ext.form.field.ComboBox', {
    typeAhead: true,
    transform: 'countrySelect',
    forceSelection: true

    // will create a hidden input with the correct value        
    ,hiddenName: 'country'

    // prevent visible input to be included into the submitted data
    ,listeners: {
        afterrender: function() {
            this.inputEl.dom.removeAttribute('name');
        }
    }
});

您可能希望将最后一部分打包到覆盖中。那将是:

Ext.define('Ext.ux.ComboBoxPreventDoubleSubmit', {
    override: 'Ext.form.field.ComboBox'
    ,afterRender: function() {
        this.callParent(arguments);
        if (this.hiddenName) {
            this.inputEl.dom.removeAttribute('name');
        }
    }
});