title: Load pandas dataframe in bootstrap table (python -> jquery) through django
body: <p>I am not sure what is wrong here - I have tried all combinations but can't get it to work ...
  I have the following.</p>
  
  <p>1/ A view created in Python with a data context variable (django framework)</p>
  
  <pre><code>def index(request):
      # Sim df
      df = pd.DataFrame()
      df = df.append({'col1': 'col1', 'col2': 'col2'}, ignore_index=True)
  
      # Context
      context = {
          'data': df.to_json(orient='records'),
      }
      return render(request, 'index.html', context)
  </code></pre>
  
  <p>2/ A loader for my dataframe table using "bootstrap-table" (part of index.html)</p>
  
  <pre><code>$(function() {
    $('#datatable').bootstrapTable({
      columns: [{
      field: 'col1',
      title: 'col1'
    }, {
      field: 'col2',
      title: 'col2'
    }],
    data: [{col1: '1', col2: 'Item1'}]
    });
  });
  </code></pre>
  
  <p>3/ Above works just fine with two columns displayed and one row. However, if I replace and use the following it just does not anymore. No specific error but it does not display anything ...</p>
  
  <pre><code>$(function() {
    $('#datatable').bootstrapTable({
      columns: [{
      field: 'col1',
      title: 'col1'
    }, {
      field: 'col2',
      title: 'col2'
    }],
    data: '{{data}}', // loading from context
    });
  });
  </code></pre>