title: Knockout-kendo.js DropDown in Grid Cell
body: <p>Is there an appropriate way to integrate a kendo-ui dropdown in a column of kendo-ui grid?</p>
  
  <p>Here is what I had tried using rniemeyer's <a href="http://rniemeyer.github.com/knockout-kendo/web/Grid.html" rel="nofollow">Knockout-kendo.js</a>.
  Inside $(document).ready:</p>
  
  <pre><code>function statusDropDownEditor(container, options) {
           $('&lt;input data-text-field="name" data-value-field="id" data-bind="value:' + options.field + '"/&gt;')
               .appendTo(container)
               .kendoDropDownList({
                   autoBind: false,
                   dataSource: {
                       transport: {
                           read: "/api/Status"
                       }
                   }
               });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="prod-grid" data-bind="kendoGrid: { data: Products, height: 480,
      sortable: true, selectable: 'row', scrollable: true, resizable: true, pageable: false,
      columns: [ 
      { field: 'ProdName', title : 'Product Name'}, 
      { field: 'UnitCost', title: 'Unit Cost'}, 
      { field: 'TotalAmt', title: 'Batch Total'},
      { field: 'Manufacturer', title: 'Manufacturer'},
      { title: 'Status', editor: statusDropDownEditor}
  }&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>However, it'll produce an error that says: 
  <em>Uncaught Error: Unable to parse bindings.
  Message: ReferenceError: categoryDropDownEditor is not defined;</em></p>
  
  <p>Also, I hope to have the dropdown display the status value based on the Products model.</p>