title: Kendo UI MVVM Datasource binding to html input element
body: <p>newbie to kendo</p>
  
  <p>The kendo datasource only returns arrays and my RESTful api returns a client as an array of one element.</p>
  
  <p>However, I cannot seem to bind the 'Name' field of the client to an html input box.</p>
  
  <p>I can however consume the data if I put it in a 'ul', as shown in the below code.  I know the json response is well formed because I can  console.log(obj[0].Name); </p>
  
  <p>I attempted to return obj[0] in the data: of the datasource but that just broke everything. (no slice error message, as it tries to slice up the array).</p>
  
  <p>I'm sure this is easy but I must be just thinking about this all wrong...</p>
  
  <p>Html and js below:</p>
  
  <pre><code>&lt;div data-role="view" data-title="Client Detail" data-model="app.clientView"&gt;
  
  &lt;!-- this does not work --&gt;
  
  &lt;input data-bind="value: app.clientView.data"/&gt;
  &lt;input data-bind="value: app.clientView.data[0].Name"/&gt;
  &lt;input data-bind="value: app.clientView.data.Name"/&gt;
  
  &lt;!-- this works --&gt;
  
  &lt;ul data-role="listview" data-source="app.clientView.data" data-template="client-template"&gt;&lt;/ul&gt; 
  
  &lt;script type="text/x-kendo-template" id="client-template"&gt;
      &lt;a href="components/clientView/view.html?id=#: ID #"&gt;
          &lt;div&gt;#: Name #&lt;/div&gt;
          &lt;div&gt;#: LastActivityOn #&lt;/div&gt;
      &lt;/a&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>app.clientView = kendo.observable({
      data: new kendo.data.DataSource({
          transport: {
              read: {
                  url: app.uri + "clients/69", //+ id,
                  type: "get",
                  dataType: "json",
                  beforeSend: function (req) {
                      req.setRequestHeader('X-authKey', app.key);
                  }
              }
    },
          schema: {
           data: function (response) {
               console.log(response);
               var obj = $.parseJSON(response);
                  console.log(obj[0].Name);
               return obj;
           }
          }
      })
  });</code></pre>
  </div>
  </div>
  </p>