New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

grid library conflict with jquery.ui #222

Closed
pentexsoft opened this Issue Dec 23, 2017 · 7 comments

Comments

Projects
None yet
2 participants
@pentexsoft

pentexsoft commented Dec 23, 2017

When using bootstrap4 & fontawesome for grid libraries along with jquery ui, the jquery ui file ( jquery-ui.css) prevents the fonts from showing in column type:'icon' in the grid.
the default icon '>' shows instead of the fontawesome icon.

@atatanasov

This comment has been minimized.

Show comment
Hide comment
@atatanasov

atatanasov Dec 25, 2017

Owner

This should be fixed in the new version 1.7.2 that is released today. Could you try the new version.

Owner

atatanasov commented Dec 25, 2017

This should be fixed in the new version 1.7.2 that is released today. Could you try the new version.

@pentexsoft

This comment has been minimized.

Show comment
Hide comment
@pentexsoft

pentexsoft Dec 25, 2017

v1.7.2 still does not work with the icon column type.
below still shows the standard arrow up icon instead of the fa-pencil.

example:
{ title: '', field: 'Edit', width: 38, type: 'icon', icon: 'fa fa-pencil ', tooltip: 'Edit', events: { 'click': CompanyEquipment_Edit } },

pentexsoft commented Dec 25, 2017

v1.7.2 still does not work with the icon column type.
below still shows the standard arrow up icon instead of the fa-pencil.

example:
{ title: '', field: 'Edit', width: 38, type: 'icon', icon: 'fa fa-pencil ', tooltip: 'Edit', events: { 'click': CompanyEquipment_Edit } },

@atatanasov

This comment has been minimized.

Show comment
Hide comment
@atatanasov

atatanasov Dec 26, 2017

Owner

The issue is probably somewhere else. It works in this example http://gijgo.com/Temp/f5e398fe-ddb6-4da6-a3bd-5dc9e749895c.html

You can always use http://gijgo.com/grid/configuration/column.renderer in order to add the column manually if type icon is problematic.

Owner

atatanasov commented Dec 26, 2017

The issue is probably somewhere else. It works in this example http://gijgo.com/Temp/f5e398fe-ddb6-4da6-a3bd-5dc9e749895c.html

You can always use http://gijgo.com/grid/configuration/column.renderer in order to add the column manually if type icon is problematic.

@atatanasov atatanasov closed this Dec 26, 2017

@pentexsoft

This comment has been minimized.

Show comment
Hide comment
@pentexsoft

pentexsoft Dec 26, 2017

this issue is with jquery.ui
the example you have listed above does not have jquery ui in it.
this is the file that is causing the issue: jquery-ui.min.css.
I also understand I can use another technique, but wanted to report this as jquery.ui is a common plugin.

pentexsoft commented Dec 26, 2017

this issue is with jquery.ui
the example you have listed above does not have jquery ui in it.
this is the file that is causing the issue: jquery-ui.min.css.
I also understand I can use another technique, but wanted to report this as jquery.ui is a common plugin.

@atatanasov

This comment has been minimized.

Show comment
Hide comment
@atatanasov

atatanasov Dec 27, 2017

Owner

I included jqueryui in the example below, but everything looks good.

http://gijgo.com/Temp/90543f86-7dcf-4a88-9758-2081c422904d.html

Owner

atatanasov commented Dec 27, 2017

I included jqueryui in the example below, but everything looks good.

http://gijgo.com/Temp/90543f86-7dcf-4a88-9758-2081c422904d.html

@pentexsoft

This comment has been minimized.

Show comment
Hide comment
@pentexsoft

pentexsoft Dec 27, 2017

I am using bootstrap 4. it still has a problem.

here are the script files I have tested with:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/gijgo/1.7.2/combined/css/gijgo.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/gijgo/1.7.2/combined/js/gijgo.min.js"></script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

pentexsoft commented Dec 27, 2017

I am using bootstrap 4. it still has a problem.

here are the script files I have tested with:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/gijgo/1.7.2/combined/css/gijgo.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/gijgo/1.7.2/combined/js/gijgo.min.js"></script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

atatanasov pushed a commit that referenced this issue Dec 29, 2017

Atanas Atanasov
fixed #222
added timepicker sceleton
@atatanasov

This comment has been minimized.

Show comment
Hide comment
@atatanasov

atatanasov Dec 29, 2017

Owner

I saw the issue. We fixed that in the new development version.

Owner

atatanasov commented Dec 29, 2017

I saw the issue. We fixed that in the new development version.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment