Kendo re-bind dropdownlist datasource
<p>I have a section of html that contains a rather large set of input controls that is generated dynamically from a set of JSON data returned from the server. </p>

<p>The HTML controls are built from the JSON data along with the items associated with them.</p>

<p>The dropdownlist selection items are bound using the attributes:</p>

<p><code>data-bind='source: sourceObject'</code><br>
<code>data-text-field='optionText'</code><br>
<code>data-value-field='optionValue'</code></p>

<p>This is the javascript that creates the input select control:</p>

<pre><code>function CreateSelectList(label, i, name) {
    var element = '&lt;select data-bind=\'source:reportFormData.FormField[' + i + '].Options.Option\' data-value-field=\'optionValue\' data-text-field=\'optionText\' id=\'' + name + '\' name=\'' + name + '\' data-role=\'dropdownlist\'&gt;&lt;/select&gt;';
    return CreateFormField(label, element);
}
</code></pre>

<p><strong>Problem: I need to selectively modify the data source of one of the dropdowns. I can't figure out how to programatically change the datasource.</strong></p>

<p>This doesn't work:</p>

<pre><code>var ddlData = $("#ddl_location").data("kendoDropDownList");
ddlData.setDataSource(jsonData.Option);
</code></pre>

<p>nor does this:</p>

<pre><code>$("#ddl_location").kendoDropDownList({
    dataTextField: "optionText",
    dataValueField: "optionValue",
    dataSource: jsonData.Option
});
</code></pre>

<p>I've also tried calling these after:</p>

<pre><code>ddlData.trigger("change");
ddlData.refresh();
</code></pre>

<p><code>jsonData.Option</code> is in equivalent format to the original JSON element <code>Report.FormField[i].Options.Option</code> e.g. <code>"Option": [ {"optionText": "All", "optionValue": "0"}, ...</code><br>
The difference here is that it is a new subset of data that needs to replace the original datasource.</p>

<p>here is a excerpt from the full JSON used to initially create the controls:</p>

<pre><code>{
"Report": {
    "report_id": "1",
    "FormField": [{
        "description": "End DateTime Picker",
        "name": "end_date",
        "label": "End Date",
        "FieldType": "datepicker",
        "displayOrder": "2",
        "isRequired": "1",
        "requiredFieldValidationMessage": "End Date is required."
    },
    {
        "description": "Client",
        "name": "ddl_client",
        "label": "Client",
        "FieldType": "dropdownlist",
        "displayOrder": "3",
        "isRequired": "0",
        "Options": {
            "Option": [{
                "optionText": "All",
                "optionValue": "0"
            },
            {
                "optionText": "*Airport Business Center",
                "optionValue": "68955"
            },
            {
                "optionText": "*Cushman &amp; Wakefield",
                "optionValue": "68996"
            },
            {
                "optionText": "*IBMC College ",
                "optionValue": "68804"
            }
            ...
    }
</code></pre>