title: Create jquery DataTable from JSON returned by Python
body: <p>I am trying to build a html table from a json that I create after pulling data from a server. </p>
  
  <p>The data seems to show up in the correct format, but DataTable is spitting back a requested unknown parameter for 'CIK' error. The JavaScript debugger says assign:"[{"CIK": "20", "Date": "2005-12-31"}]"</p>
  
  <p>I've tried all kinds of things, but I can't seem to get this to work.</p>
  
  <p>Here's the code that pulls the data using Python/Flask</p>
  
  <pre><code>@app.route('/getJobs')
  def getJobs():
      try:
          if session.get('user'):
              connection_string = r"mssql+pymssql://{0}:{1}@MSSQL/CashFlow".format(
              session['user'],
              session['password'],)
              engine= create_engine(connection_string, echo=True)
              con = engine.connect()
              assigned=con.execute('select cik, datadate from assignments where %s=ID', (session['user']))
              assign=[]
              for job in assigned:
                  assigndict={'CIK':str(job[0]), 'Date':str(job[1])}
                  assign.append(assigndict)
              print assign
              return json.dumps(assign)
          else:
              return render_template('error.html', error = 'Unauthorized Access')
      except Exception as e:
          return render_template('error.html', error = str(e))    
  </code></pre>
  
  <p>This is my HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;title&gt;Cash Flow App&lt;/title&gt;
  
  
      &lt;link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet"&gt;
  
      &lt;link href="http://getbootstrap.com/examples/jumbotron-narrow/jumbotron-narrow.css" rel="stylesheet"&gt;
      &lt;link href="../static/css/signup.css" rel="stylesheet"&gt;
      &lt;script src="../static/js/jquery-1.11.2.js"&gt;&lt;/script&gt;
      &lt;script src="../static/js/jquery-datatables.js"&gt;&lt;/script&gt;
  
  
    &lt;body&gt;
  
      &lt;div class="container"&gt;
        &lt;div class="header"&gt;
          &lt;nav&gt;
            &lt;ul class="nav nav-pills pull-right"&gt;
              &lt;li role="presentation" class="active"&gt;&lt;a href="/logout"&gt;Logout&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/nav&gt;
          &lt;h3 class="text-muted"&gt;Cash Flow App&lt;/h3&gt;
        &lt;/div&gt;
        &lt;div class="jumbotron"&gt;
          &lt;table id="asstable"&gt;
            &lt;thead&gt;
              &lt;tr&gt;
                &lt;th&gt;CIK&lt;/th&gt;
                &lt;th&gt;Date&lt;/th&gt;
              &lt;/tr&gt;
            &lt;/thead&gt;
            &lt;tbody id="tbody"&gt;
  
            &lt;/tbody&gt;
            &lt;/table&gt;
        &lt;/div&gt;
        &lt;footer class="footer"&gt;
          &lt;p&gt;&amp;copy; 2015&lt;/p&gt;
        &lt;/footer&gt;
  
      &lt;/div&gt;
    &lt;/body&gt;
      &lt;script type="text/javascript"&gt;
        $(function(){
          $.ajax({
            url : '/getJobs',
            type : 'GET',
  
            success: function(assign){
                $('#asstable').DataTable({
                  data: assign,
                  columns:[
                    {data: "CIK"},
                    {data: "Date"}
                  ]
                 });   
            },
            error: function(error){
              console.log(error);
              }
            });
          });
        &lt;/script&gt;
  
  
  &lt;/html&gt;
  </code></pre>