Skip to content

Compatible with Twitter Bootstrap 2.3.3#956

Open
SantiagoSC wants to merge 3 commits into
volosoft:masterfrom
SantiagoSC:master
Open

Compatible with Twitter Bootstrap 2.3.3#956
SantiagoSC wants to merge 3 commits into
volosoft:masterfrom
SantiagoSC:master

Conversation

@SantiagoSC

Copy link
Copy Markdown

This version will show any dialog using bootstrap modal instead of
jQuery UI Dialog if useBootstrap option is true.

This version will show any dialog using bootstrap modal instead of
jQuery UI Dialog if useBootstrap option is true.
@kamov

kamov commented Sep 14, 2014

Copy link
Copy Markdown

for bootstrap 3 ?

@SantiagoSC

Copy link
Copy Markdown
Author

Modal structure in bootstrap 3 have few differences, so this version will not work properly in bootstrap 3. The good news are that it's very simple to change modal div by wrapping header, body and footer in modal-content div.

@kamov

kamov commented Sep 16, 2014

Copy link
Copy Markdown

any sample?

@cocomo

cocomo commented Jan 3, 2015

Copy link
Copy Markdown

Thank you SantiagoSC for kicking me into the right direction. In addition to your explanation I also had to remove the hide class from the bs2 dialog and wrap the whole thing into another div having the modal-dialog class. Here's a sample from the edit div:

self._$editDiv.addClass("modal fade"); // remove class 'hide'
self._$editDiv.css({ width: 'auto' });
self._$editDiv.append(
    '<div class="modal-dialog">' + // add bs3 classes for modals
        '<div class="modal-content">' + // add bs3 classes for modals
            '<div class="modal-header">' +
                '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>' +
                '<h3>' + self.options.messages.editRecord + '</h3>' +
            '</div>' +
            '<div class="modal-body" style="min-width: 300px;"></div>' +
            '<div class="modal-footer">' +
                '<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">' + self.options.messages.cancel + '</a>' +
                '<a id="EditDialogSaveButton" href="#" class="save btn btn-primary">' + self.options.messages.save + '</a>' +
            '</div>' +
        '</div>' + // add closing divs for bs3 modals 
    '</div>' // add closing divs for bs3 modals 
);

@halloulpsx

Copy link
Copy Markdown

Any one got it working ? , is there a live demo ?

@cocomo

cocomo commented Feb 6, 2015

Copy link
Copy Markdown

It's not so hard to change these dialogues to bootstrap modals, took me less than an hour to get santiagos solution working with my table. Still: At my instance i haven't made it jet to adjust icons, buttons, pagination to bootstraps appearance..

@krissanawat

Copy link
Copy Markdown

attach jquery ui bootstrap
add jqueryuiTheme: true

 $('.table').jtable({
    jqueryuiTheme: true,
            ajaxSettings: {

and combind with changcolumnVisilbility

work perfect

Compatible with jQuery UI, Bootstrap 2 and Bootstrap 3
@SantiagoSC

Copy link
Copy Markdown
Author

Bootstrap 3 support commited.

When editing a record, after click on save button, it remains as saving
and disabled.
@mnusurov

Copy link
Copy Markdown

Hi all,
Dear SantiagoSC very interested in your solution to this project. Unfortunately it doesn't work with current version of jTable 2.4.0. I also wasn't able to get jTable 2.3.1 version this brach is broken and cannot be pulled.

@jvsbautista

jvsbautista commented Jan 18, 2018

Copy link
Copy Markdown

@mnusurov, I've managed to make progress and made it work on jTable 2.4.0.

In jquery.jtable.js, I changed all instances of the script: addClass("modal hide fade") into addClass("modal fade");
I'm still in the process of checking if it'll hold but so far so good.

Logof pushed a commit to Logof/jTable that referenced this pull request Jul 23, 2022
Logof pushed a commit to Logof/jTable that referenced this pull request Jul 23, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants