-
jsetzer
- AppGini Super Hero
- Posts: 1817
- Joined: 2018-07-06 06:03
- Location: Kiel, Germany
-
Contact:
Post
by jsetzer » 2018-08-07 12:29
Hi there,
I'd like to put (Bootstrap-) badges inside the tab-captions of the details-tabs indicating the number of records:
- chrome_2018-08-07_14-10-36.png (201.73 KiB) Viewed 1642 times
The Bootstrap-code is quite simple:
Code: Select all
<ul class="nav nav-tabs">
<!-- ... -->
<li class="">
<a href="#...-..." id="...-..." data-toggle="tab" aria-expanded="false" style="display: none;">
Hinweise <span class="badge">3</span>
</a>
</li>
</ul>
There are two problems:
- The javascript function has to be called after the tab has been loaded completely
Unfortunately $j(function(){...}); will be executed before the tabs have been loaded completely
- I have to find out the number of records per details-tab
If there are more than 10 records counting then number or <tr> will not give the total number of records because of pagination
Can anybody help solving one or both problems?
Thanks in advance,
Kind Regards,
Jan
Kind regards,
<js />
My AppGini Blog:
https://appgini.bizzworxx.de/blog
You can help us helping you:
Please always put code fragments inside
[code]...[/code]
blocks for better readability
AppGini 24.10 Revision 1579 + all AppGini Helper tools
-
jsetzer
- AppGini Super Hero
- Posts: 1817
- Joined: 2018-07-06 06:03
- Location: Kiel, Germany
-
Contact:
Post
by jsetzer » 2018-08-07 20:31
Solution for problem #1:
I am using
$j(document).ajaxStop(function () { /* ... */ }) to execute my code after every ajax call has finished. Now I can access the details tabs. Right now I am able to place badges with (dummy) value 999 into the tab captions.
Code: Select all
$j(document).ajaxStop(function () {
var nav = $j('#children-tabs').find('ul.nav-tabs');
nav.find('li').each(function () {
var li = $j(this);
var a = li.children('a').first();
var count = 999; // todo: get the number of records
if (count > 0)
$j('<span />').css('margin-left', '8px').addClass('badge').append(count).appendTo(a);
});
});
- chrome_2018-08-07_22-26-53.png (3.06 KiB) Viewed 1626 times
There is still problem #2: getting the correct number of records.
Kind Regards,
Jan
Kind regards,
<js />
My AppGini Blog:
https://appgini.bizzworxx.de/blog
You can help us helping you:
Please always put code fragments inside
[code]...[/code]
blocks for better readability
AppGini 24.10 Revision 1579 + all AppGini Helper tools
-
jsetzer
- AppGini Super Hero
- Posts: 1817
- Joined: 2018-07-06 06:03
- Location: Kiel, Germany
-
Contact:
Post
by jsetzer » 2018-08-07 21:16
Solution for problem #2: Well...
...I'm not satisfied with this workaround... but it works for the moment:
Code: Select all
$j(document).ajaxStop(function () {
var nav = $j('#children-tabs').find('ul.nav-tabs');
nav.find('li').each(function () {
var a = $j(this).children('a').first();
a.find('span.badge').remove();
var panel_id = a.attr('href');
var panel = $j(panel_id);
var text = panel.find('.table-responsive > table > tfoot').text().trim();
count = text.split(' ').pop();
if (count > 0)
$j('<span />').css('margin-left', '8px').addClass('badge').append(count).appendTo(a);
});
});
The last row of the tab's table contains the number of records. I can fetch that last number and place it inside the tab caption as badge.
Here is what it looks like right now:
- 2018-08-07_23-15-09.png (25.8 KiB) Viewed 1625 times
This may not be the best solution - but it works without touching overwritable files.
Kind regards,
<js />
My AppGini Blog:
https://appgini.bizzworxx.de/blog
You can help us helping you:
Please always put code fragments inside
[code]...[/code]
blocks for better readability
AppGini 24.10 Revision 1579 + all AppGini Helper tools