Databases
StackOverflow2013
Postsdbo
POember js with datatables plugin
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POember js with datatables plugin
    primarykey
    data
    text
    <p>I am trying the datatable jquery plugin with EMber JS. Looks like the moment Ember tries to update the DOM with some fresh data, it has a problem after datatable has styled and inserted some elements like search bar, twitter bootstrap pagination footer etc. The code is as follows</p> <pre><code>App.TableView = Em.View.extend({ classNames:['table','table-striped','table-bordered','dataTable'], tagName:'table', didInsertElement:function (){ this.$().dataTable({ "sPaginationType": "bootstrap", "oLanguage": { "sLengthMenu": "_MENU_ records per page" } }); } }); </code></pre> <p>The usage in the handlebars is as follows:</p> <pre><code>{{#view App.TableView }} {{view App.ListStaffView}} {{/view}} </code></pre> <p>The App.ListStaffView has the following in it</p> <pre><code>App.ListStaffView = Ember.View.extend({ templateName: 'list', staffBinding: 'App.staffController', showNew: function() { this.set('isNewVisible', true); }, hideNew: function() { this.set('isNewVisible', false); }, refreshListing: function() { App.staffController.findAll(); } }); </code></pre> <p>and the list template is as follows</p> <pre><code>&lt;thead&gt; &lt;tr&gt; &lt;th&gt;Name&lt;/th&gt; &lt;th&gt;Email&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; {{#each staff}} {{view App.ShowStaffView staffBinding="this"}} {{/each}} &lt;/tbody&gt; &lt;tfoot&gt; &lt;div class="commands"&gt; &lt;a class="btn btn-inverse" href="#"{{action "showNew"}}&gt; &lt;i class="icon-plus"&gt;&lt;/i&gt; &lt;/a&gt; &lt;a class="btn btn-inverse" href="#"{{action "refreshListing"}}&gt; &lt;i class="icon-refresh"&gt;&lt;/i&gt; &lt;/a&gt; &lt;/div&gt; &lt;/tfoot&gt; </code></pre> <p>The Error after loading this is like this</p> <p>Error: Cannot perform operations on a Metamorph</p> <p>I did the datatable integration with zero configuration and that failed. Since Ember cannot insert data into DOM, JQuery datatable keeps saying "No data"</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USRoney Banerjee
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POember js with datatables plugin
      1. USTrindaz
      1. VTFavorite
    2. VO
      singulars
      1. POember js with datatables plugin
      1. This table or related slice is empty.
      1. VTUpMod
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload