How do i setup jQuery footables to show the toggle -

-

as question suggests cannot seem configure foo-tables, in basic way - 3 columns, last column toggle shows detail row. markup code thus:

$('.footable').footable({});
.footable {    font-size: 88%;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <table class="table footable fw-labels" data-page-navigation=".pagination" data-page-size="6">      <thead>      <tr>        <th>action</th>        <th data-toggle="true">details</th>        <th data-hide="all">details</th>      </tr>    </thead>      <tbody>        <tr class="row-primary">        <td><span class="label label-primary">primary</span>        </td>        <td>this footable expandable <b class="text-primary">"primary"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-primary&quot;&gt;</code>        </td>      </tr>        <tr class="row-info">        <td><span class="label label-info">info</span>        </td>        <td>this footable expandable <b class="text-info">"info"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-info&quot;&gt;</code>        </td>      </tr>        <tr class="row-success">        <td><span class="label label-success">success</span>        </td>        <td>this footable expandable <b class="text-success">"success"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-success&quot;&gt;</code>        </td>      </tr>        <tr class="row-warning">        <td><span class="label label-warning">warning</span>        </td>        <td>this footable expandable <b class="text-warning">"warning"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-warning&quot;&gt;</code>        </td>      </tr>        <tr class="row-danger">        <td><span class="label label-danger">danger</span>        </td>        <td>this footable expandable <b class="text-danger">"danger"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-danger&quot;&gt;</code>        </td>      </tr>        <tr class="row-alert">        <td><span class="label label-alert">alert</span>        </td>        <td>this footable expandable <b class="text-alert">"alert"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-alert&quot;&gt;</code>        </td>      </tr>        <tr class="row-system">        <td><span class="label label-system">system</span>        </td>        <td>this footable expandable <b class="text-system">"system"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-system&quot;&gt;</code>        </td>      </tr>        <tr class="row-dark">        <td><span class="label label-dark">dark</span>        </td>        <td>this footable expandable <b class="text-dark">"dark"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-dark&quot;&gt;</code>        </td>      </tr>        <tr class="row-primary">        <td><span class="label label-primary">primary</span>        </td>        <td>this footable expandable <b class="text-primary">"primary"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-primary&quot;&gt;</code>        </td>      </tr>        <tr class="row-info">        <td><span class="label label-info">info</span>        </td>        <td>this footable expandable <b class="text-info">"info"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-info&quot;&gt;</code>        </td>      </tr>        <tr class="row-success">        <td><span class="label label-success">success</span>        </td>        <td>this footable expandable <b class="text-success">"success"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-success&quot;&gt;</code>        </td>      </tr>        <tr class="row-warning">        <td><span class="label label-warning">warning</span>        </td>        <td>this footable expandable <b class="text-warning">"warning"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-warning&quot;&gt;</code>        </td>      </tr>        <tr class="row-danger">        <td><span class="label label-danger">danger</span>        </td>        <td>this footable expandable <b class="text-danger">"danger"</b> row</td>        <td>you can use style formatting table row <code>&lt;tr class=&quot;row-danger&quot;&gt;</code>        </td>      </tr>      </tbody>    <tfoot class="footer-menu">      <tr>        <td colspan="5">          <nav class="text-right">            <ul class="pagination hide-if-no-paging"></ul>          </nav>        </td>      </tr>    </tfoot>  </table>

i have example template got code works - in actual app im building third row should hidden until toggled un-rendered , shows third column. setup follows:

  • footable - version : 2.0.3
  • jquery-1.11.1
  • jquery ui - v1.11.0 - 2014-06-26
  • chrome : version 46.0.2490.80 m

any pointers appreciated - in advance. btw have correct footables css file referenced in app (not shown in code snippet above)

found solution here : footable in bootstrap 3 not initializing

(so please stop stampede answer ;¬) )

thanks


Comments

Post a Comment

Popular posts from this blog

github - Git errors while pushing -

-
Image
i input "git add -a" , gives me error: "fatal: unknown index entry format 65540000". i looked every other sources , not figure out means. then, tried pushing using sourcetree , got error below: all added codes , few imagefiles. not sure causing problem. last commit did month ago, btw. first commit after upgraded xcode 7.0 version. thanks this first commit after upgraded xcode 7.0 version then try clone again repo xcode7, , add change in new local repo. should work better in clone entirely managed new xcode.
Read more

php - Using grpc in Laravel, "Class 'Grpc\ChannelCredentials' not found." -

-
i trying use grpc in laravel project. this part of composer.json file: "require": { ... "datto/protobuf-php": "dev-master", "google/auth": "^0.7.0", "grpc/grpc": "dev-release-0_13", ... } i have generated php file proto file. placed in app/services/ , included in composer.json autoload.files section. have run composer install without issues. i have created route testing. has following code: $client = new vat_service\vatserviceclient('localhost:50051', [ 'credentials' => grpc\channelcredentials::createinsecure() ]); but receive response class 'grpc\channelcredentials' not found. when visit route. the laravel app running in homestead vagrant box. i don't know how proceed. missing dependency? did miss install something? i have solved problem, not sure of below steps solution. things tried: i installed grpc-beta in homestead box (...
Read more

c++ - How can I delete a QSharedPointer -

-
i have written wrapper around qtextedit use qiodevice. want able use multiple wrapper same qtextedit, may use different text color each wrapper. to make wrapper thread-safe added qmutex protect usage of qtextedit. thinking must use 1 mutex protect 1 qtextedit. i end following implementation, using qsharedpointer protect qtextedit. texteditiodevice.h class texteditiodevice : public qiodevice { q_object public: texteditiodevice(qtextedit * qtextedit, qcolor color, qobject * parent); virtual ~texteditiodevice(); protected: qint64 readdata(char *data, qint64 maxlen); qint64 writedata(const char *data, qint64 len); private: /** * @brief pointer qtextedit */ qpointer<qtextedit> textedit; /** * @brief text color */ qcolor color; /** * @brief shared pointer qtextedit associated mutex */ qsharedpointer<qmutex> mutex; /** * @brief storage qtextedit associated mutexes */ sta...
Read more