Home News Contact Us Forum About Us Demos Products F.A.Q.
Shopping Cart
You currently have 0 items in your cart.


Recent Events
  • 31/12/2023 New Year SALE

    We are glad to announce New Year SALE. 25% discount for all our extensions. Use NY24 coupon code. Hurry up the discount is valid till 7 January.

  • 21/11/2023 BLACK FRIDAY 23 is coming

    BIG SALE, 35% discount for all our extensions. Use BF23 coupon code. Hurry up the discount is valid till 27 November.


2Checkout.com, Inc. is an authorized retailer of goods and services provided by ARI Soft. 2CheckOut




Follow us on twitter



Welcome, Guest
Please Login or Register.    Lost Password?

Column Width management while using jDataTable
(1 viewing) (1) Guest
Go to bottomPage: 12
TOPIC: Column Width management while using jDataTable
#2314
Column Width management while using jDataTable 14 Years, 8 Months ago Karma: 0
I am using the jDataTable plugin. I have given bAutoWidth as false, both in the plugin settings and on the page where I used {arijdatatable bFilter="true" bSort="true" bStateSave="true" bAutoWidth="false"}
I am still not able to control column width and also there is a lot of space between one table and the next.

Here is the page: tdudevtest.com/QA/class-schedule

Can you please help?

Thank you.
The administrator has disabled public write access.
 
#2318
Re:Column Width management while using jDataTable 14 Years, 7 Months ago Karma: 747
Hello,

You can read this post on our forum, it contains information how to create columns in ARI JDataTable with fixed size.

Regards,
ARI Soft
The administrator has disabled public write access.
 
#2323
Re:Column Width management while using jDataTable 14 Years, 7 Months ago Karma: 0
I added the css code to my template and set the autowidth as false. I have a html table and I defined the column width for each column. I am still not getting fixed column width.

Page: tdudevtest.com/QA/class-schedule
The administrator has disabled public write access.
 
#2325
Re:Column Width management while using jDataTable 14 Years, 7 Months ago Karma: 747
It seems that 'CSS Template' is disabled because if open page source, it doesn't contain including of any 'CSS Template'. Could you provide plugin code which you use and CSS rules?

Regards,
ARI Soft
The administrator has disabled public write access.
 
#2326
Re:Column Width management while using jDataTable 14 Years, 7 Months ago Karma: 0
Thank you for trying to help me with this.

I added {arijdatatable bFilter="true" bSort="true" bStateSave="true" bAutoWidth="false"}

at the top of each table on the tdudevtest.com/QA/class-schedule page.

Here is the CSS template. I added the table.fixedwidth at the end of the tempalate

/* Style 1 */

a,
h2,
.componentheading {
color: #F68933;
}

/* @group Structure */

#logo {
background: url(../images/style1/logo.png) 0 0 no-repeat;
}

#showcase {
background: white url(../images/style1/showcase-bg.png) 0 0 repeat-x;
}

#showcase2 {
background: url(../images/style1/showcase-promo.jpg) 50% 0 no-repeat;
}

#featured-mod {
background: url(../images/style1/featuremod-bg.png) 50% 0 repeat-x;
}

#featured-mod2 {
background: url(../images/style1/featuremod-bg2.jpg) 50% 0 no-repeat;
}

/* @end */

/* @group Horizontal Menu */

#horiz-menu {
background: url(../images/style1/horiz-menu-bg.png) 0 0 repeat-x;
}

#horiz-menu ul ul {
background-repeat: repeat;
background-image: url(../images/style1/tdu-menu-bg.png);

}

#horiz-menu ul ul ul {


}

#horiz-menu li a {
color: white;
background: url(../images/style1/horiz-menu-div.png) 100% 50% no-repeat;
}

#horiz-menu a {
text-transform: uppercase;
color: #fff;
}

#horiz-menu li.active a {
text-transform: uppercase;
color: #8E3C00;
}

#horiz-menu li.active a {
color: #8E3C00;
}

#horiz-menu a:hover {
color: #8E3C00;
}

#horiz-menu ul ul li a,
}

#horiz-menu ul li.active.parent ul a {
background: url(../images/style1/dropdown-arrow.png) 10px 50% no-repeat;
color: #FFFFFF;
}

/* @end */

/* @group Main Menu */

a.mainlevel {
background: url(../images/style1/vertmenu-bg.png) 0 0 no-repeat;
color: #666;
}

a#active_menu.mainlevel,
a.mainlevel:hover {
color: #8E3C00;
}

a.sublevel:hover,
a#active_menu.sublevel {
color: #8E3C00;
}

a.sublevel {
color: #666;
}

/* @end */

/* @group Sub Menu */

ul.menu a {
background: url(../images/style1/vertmenu-bg.png) 0 0 no-repeat;
color: #666;
}

ul.menu li.active a,
ul.menu li a:hover,
ul.menu li.parent li.active a,
ul.menu li.parent li.parent li.active a,
ul.menu li.parent li.active a:hover,
ul.menu li.parent li.parent li.active a:hover,
ul.menu li.active a:hover {
color: #18A7E1;
}

ul.menu li.parent li a,
ul.menu li.parent li.parent li a {
color: #666;
}

/* @end */

.rok-content-rotator h2 a:hover,
.rok-content-rotator h2 a.active,
#rokslide-toolbar li.current {
color: #178FC0;
}

/* @group Typography */

ul.bullet-1 li {
background: url(../images/style1/dropdown-arrow.png) 0 3px no-repeat;
}

ul.bullet-2 li {
background: url(../images/style1/bullet-2.png) 0 3px no-repeat;
}

ul.bullet-3 li {
background: url(../images/style1/bullet-3.png) 0 3px no-repeat;
}

ul.bullet-4 li {
background: url(../images/style1/bullet-4.png) 0 3px no-repeat;
}

ul.bullet-5 li {
background: url(../images/style1/bullet-5.png) 0 3px no-repeat;
}

.important2 {
border: 1px solid #178FC0;
}

span.highlight-color {
background: #178FC0;
color: #fff;
}

span.important-title2,
span.number-color,
blockquote.color2,
span.dropcap-color {
color: #178FC0;
}

.dataTables_wrapper {
min-height:180px !important;
_height: 1%;
}

TABLE.fixedLayout
{
table-layout: fixed;
}
The administrator has disabled public write access.
 
#2327
Re:Column Width management while using jDataTable 14 Years, 7 Months ago Karma: 747
Hello,

It seems that you don't apply 'fixedLayout' CSS class to HTML tables. Add class="fixedLayout" to tables on your page, please. And you can add CSS rules for ARI Smart Content plugins in 'CSS Templates' section on the component backend.

Regards,
ARI Soft
The administrator has disabled public write access.
 
Go to topPage: 12