JQuery Serialize Form - Kendo UI Duplicating Inputs
<p>I'm working on posting a form and noticed that Kendo UI screws with the form fields when serialized and creates a duplicate field in the serialized object.  I want to know if anyone has come across this before and if there's a solution.</p>

<p>So let's say I want to do a JQuery AJAX post of a form.</p>

<pre><code>$.ajax({
    type: "POST",
    url: "/api/MyController",
    data: formData
});
</code></pre>

<p>I can have a simple form like this.</p>

<pre><code>&lt;form id="myForm"&gt;
    &lt;input type="text" name="firstName"&gt;
&lt;/form&gt;
</code></pre>

<p>If I want to serialize my form data (used in the formData variable), I would do this.</p>

<pre><code>var formData = $('#myForm').serializeArray();
</code></pre>

<p>The output in the console would look like this.</p>

<pre><code>[Object { name="firstName",  value="John"}]
</code></pre>

<p>Now the problem.
If I'm using Kendo UI and I'm making a dropdown or combobox out of that input and I try to serialize the form, another input (the one with the underscore) is recognized.</p>

<pre><code>[Object { name="firstName_input",  value="John"}, Object { name="firstName",  value="John"}]
</code></pre>

<p>If you're not familiar, Kendo UI uses a simple input to create comboboxes or dropdowns with remote calls to an api for data.  Here's how the combobox is created.</p>

<pre><code>var firstNameComboBox= $('#firstName').kendoComboBox({
    placeholder: "Select a Name",
    dataTextField: "Name",
    dataValueField: "ID",
    change: myChangeFunction,      //On change event
    dataSource: {
        type: "json",
        transport: {
            read: {
                dataType: "json",
                url: "/api/MyController/MyAction",
                data: { }
            },
        }
    }
}).data("kendoComboBox");
</code></pre>