如何处理JavaScript插件生成替代输入的ASP.NET表单？

Question

我有一个ASP.NET MVC网页，该网页使用这样的ajax提交表单：

function ValidateFormAndAjaxSubmit(formId, callingElement) {

    if (IsNotDblClick(callingElement.id)) {
        var _form = $("#" + formId);

        var validator = _form.validate();
        var anyError = false;

        anyError = !_form.valid();

        if (anyError) {
            window.latestClick = '';
            return false; // exit if any error found    
        }

        $.post(_form.attr("action"), _form.serialize(), function (data) {

            if (data.success && data.redirectUrl.length > 0) {
                window.location.href = data.redirectUrl;
            }
            else {

                var isValid = validateResponse(_form, data);

                window.latestClick = '';
            }
        })
    }
}

表单中的所有控件都是由Html.TextBoxFor等帮助程序生成的，效果很好。

问题是jQuery插件（Select2）会将常规文本框变成如下所示的列表：

<div class="floatLeft">
            <label class="controlTitleContainer" for="Url">Taggar</label>
            <br style="clear:both;">
            <div class="select2-container select2-container-multi bigdrop" id="s2id_txtTagBox" style="width: 408px">    <ul class="select2-choices" style="">  <li class="select2-search-choice">    <div>Film                </div>    <a href="#" onclick="return false;" class="select2-search-choice-close" tabindex="-1"></a></li><li class="select2-search-choice">    <div>Hund                </div>    <a href="#" onclick="return false;" class="select2-search-choice-close" tabindex="-1"></a></li><li class="select2-search-field">    <input type="text" autocomplete="off" class="select2-input valid" tabindex="0" style="width: 10px;">  </li></ul></div><input style="width: 408px; display: none;" class="bigdrop" id="txtTagBox" name="Tags" type="text" value="">
        </div>

您可以在此处看到文本框设置为不显示任何文字，而添加的标签显示为ul列表。 在这种情况下，我已将Film和Hund添加到列表中。

我需要将这些值发送到服务（通过上面的ajax调用），问题是如何？

Answer 1

从文档中可以看出，select2设计用于选择列表，而不是文本框。 尝试生成选择列表而不是文本框。

在示例中查看“多值选择框”的来源，底层标记是一个选择框，但是插件会生成一个div使其看起来像文本框。