Does anyone have an example of using the responsive grid (tablesaw or footable)? I attended a user group meeting recently and they showed that. They sent us all a zip file with a ton of stuff in it, but it requires you to import it into your environment, and I'm too new with version 8 to want to try that. I have a few reports where I'd like so slide a few columns underneath, when the screen size is narrow like on a tablet or phone. This is so cool.

This message has been edited. Last edited by: <Emily McAllister>,

That was in 8.2, which isn't out yet. Where you in the one in Jax, FL? If so that was us, I was on the back row.

Yep, I was in the front row. I must have missed the part about it being in 8.2, thanks.

It was a great meeting - I learned a lot. And the Black Knight building is gorgeous.

I think you sit right in front of me. I had the beard.

I was the fat guy

LOL You guys crack me up. Good to hear this functionality is built into 8.2. Hope that comes out soon. I've tried using the footable.js plugin myself with mixed results.

quote:

I was the fat guy

Haha, I was the guy that kept bringing up, the access removal of our html code in 8.2...

Gavin,

Did they seal off HTML code access even more in 8.2?

Actually, they started in 8.1.05. They took away the "Edit in Text Editor". There are two options.

1. Rename all your HTML's to FEX and use -HTMLFORM BEGIN/END.
2. Go into property, change your html file to TXT, then open the file, then change it back to HTM when your done. I'm sure IBI will attempt to block this option in the future as they gave me a story about how a customer broke their HTML by changing the IBI code and they spent a week working on it, before they figure it out. This is their logic of taking away this menu option. I don't use their code at all, so people like me have to do the work around.

Gavin,

So, nothing new from 8.1.05 then. They don't have the "Edit in Text Editor" option for HTML documents in our release like your were saying. I've been using workarounds myself.

They didn't take "Edit in Text Editor" out for .fexes now also did they? That would be like the end for us with IBI if that was the case. haha

Thanks for the information and update!

They removed it for HTMLs only.

Thanks Gavin! Good to know. Hopefully things will get better over time.

8.1.05 comes with a box of extra-strength Tylenol...

...and a loaded revolver

quote:

Originally posted by CoolGuy:
LOL You guys crack me up. Good to hear this functionality is built into 8.2. Hope that comes out soon. I've tried using the footable.js plugin myself with mixed results.

I just got the necessary files set up yesterday. I got it working on one of my reports in about 2 hours. That's the good news. The bad news is, I cannot seem to make it work if my report has Webfocus Page headings! That sticks an extra table into the HTML and screws it all up. I've been fighting that since yesterday morning and I'm just going in circles. Very frustrating.

Yeah, that bites. One would need to know how to modify existing jQuery to take into account the extra table element. I am somewhat familiar with the framework, but am no expert as of yet.

IBI should add some documentation for how a report/table request is generated in HTML (all case scenarios: with/without a header/footer, subtotals, etc.). In other words, what elements are used and when/why. Then again, I guess we could build out a few simple CAR file reports and look at the HTML where possible. Nevertheless...

I've been fighting it all day. I hate how they make it look so easy at the user group meetings.
I notified Rene that it doesn't work with webfocus page headings. She said she'd look into it, but she's traveling right now, so I'm trying to figure it out on my own. Better hurry, I'm almost out of hair.

The JS below uses jQuery to alter the display behaviour of a table within a table (the HEADING in a WebFOCUS HTML report). Perhaps changing the display from the default "inline" will help solve the responsive issue (I set a red border to prove that the correct element is referenced):

$( "table table" ).css( { "border": "1px solid red", "display": "block" } );

Then check these web pages:

CSS-Tricks > display (one of my favourite CSS sites)
MDN > Web technology for developers > CSS > display

IBI making it harder to get to HTML.... Sounds like instead of improving the tool they decided to double down on being a PITA.

Rumor has it that the Text Editor is coming back in 8.2.

quote:

Rumor has it that the Text Editor is coming back in 8.2.

- Haha! Joke of the day!

I heard from a credible source, but you never know.

Many thanks for the tips.

I ended up removing the webfocus headings. Then I used jquery to add some h1 and h2 lines before the body of the page. That worked fine, but I had a line on the heading that said "xx Address Changes performed this month", where xx was a TOT.COUNT of the records. I put that into a subfoot instead, so as long as the main report was the FIRST table on the page, then the footable methods worked. I'm not good enough yet with jquery to figure out how to do it right.

Mike,

Glad you found something that works for you. At some point I will need to revisit the responsive grid implementation for our reports.

Francis,

Thanks for your links and tips.

MattC,

I would love to believe IBI would be bringing the text editor back in the 8.2 release. From my experiences thus far with IBI in regard to that subject, I don't think it will be happening. Dare we throw an olive branch their way? lol

I asked Rene (the IBI rep who gave the user group presentation on this topic) if she could review the heading problem, so we'll see if they can come up with a proper work-around. I appreciate that they gave us at least a start on this, but I would really like to see them implement the thing completely. I'm still trying, but I'll be out of time pretty soon.

quote:

@CoolGuy said: I would love to believe IBI would be bringing the text editor back in the 8.2 release

They will not be bringing it back, even though, ever developer wants it there. My work around is simple, everything is done in FEX and the use of -HTMLFORM BEGIN/END

Since I do all my own HTML development anyway, I don't have to deal with half of their issues.

Gavin,

That's what I figured, but "rumors" are afoot, so I was trying to be hopeful/believing. lol

I agree that just using the -HTMLFORM BEGIN/END is the way to go unless IBI puts the text editor back in one day.

Thanks.

Any updates on an official or good workaround for adding headings into a report with tablesaw or footable Js in place??? My team lead is wanting me to revisit this functionality since AHTML sucks on mobile.

Any new developments on this front???

Thanks in advance!

For those interested,

Don't use tablesaw.js or footable.js. Use datatables.js instead. So much better.

http://datatables.net/

I've integrated a header into the mix by adding the following line into my Js:

$("body").prepend( "<b>For week ending !IBI.AMP.WKEND; !IBI.AMP.forMsg;</b>");

Made it dynamic too.

Here is my -HTMLFORM block for implementing dataTables.js. It has Search, sorting, pagination, styling abilities, etc. all built in. Way nicer than jigsaw/sander (tablesaw) or footable.

-HTMLFORM BEGIN
<script type="text/javascript" src="/ibi_apps/jquery/js/jquery.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/t/dt/dt-1.10.11,fc-3.2.1,fh-3.1.1,r-2.0.2,se-1.1.2/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/t/dt/dt-1.10.11,fc-3.2.1,fh-3.1.1,r-2.0.2,se-1.1.2/datatables.min.js"></script>

<style>
td {
line-height: .8em;
}
th, td {
white-space: nowrap;
}
td, tbody th {
vertical-align: middle;
text-align: right;
font-size: .7em;
}
table thead th, table thead td {
color: white;
font-size: .7em;
text-shadow: none;
text-align: center;
}
b {
font-size: 1.05em;
font-family: Trebuchet MS;
}
.x5 {
display:none;
}
.x6 {
display: none;
}
.dataTables_wrapper {
font-family: Trebuchet MS;
}
</style>
<script>

$("body").prepend( "<b>For week ending !IBI.AMP.WKEND; !IBI.AMP.forMsg;</b>");
$('.x1').addClass('stripe hover compact cell-border');
$('table').first().prepend('<thead></thead>');
-*$('colgroup').first().remove();
$("tr:first-child").prependTo($('thead'));

$(document).ready( function ()
{
	var iStart = new Date().getTime();
	var oTable = $('.x1').dataTable(
	{
		"scrollY": true,
		"scrollX": "300%",
		"sScrollXInner": "100%",
		"scrollCollapse": false,
-*		responsive: true,
		"lengthChange": true,
		"lengthMenu": [[5, 20, 50, 100, -1], [5, 20, 50, 100, "All"]],
		"paging": true,
		"pagingType": "full_numbers",
		"info": true,
		"pageLength": 20,
-*		"autoWidth": false,
		fixedHeader: true,
		fixedColumns: {
        	leftColumns: 3
    	},
		"ordering": true,
		"columnDefs": [
    		{ "type": "html-num-fmt", "targets": [ 0, 1, 3, 4, 5, 6, 7, 8, 9, 10 ] }
-*			{ "orderable": false, "targets": [3, 4, 5, 6, 7, 8, 9, 10 ]}
  		]
	} );
} );

</script>
-HTMLFORM END

Just plug the above block into the bottom of any of your report fexes, but inspect the page source first to see what class your table was given and your total row's and the following empty row's td tags were given and switch out any instances above of .x1 with your table class, and any instances of .x5/.x6 with your total row td tag class generated or what class the following empty row was given. The .x5 and .x6 classes are for getting rid of the extra blank row that generates at the end of your report if you choose/don't choose a total row to be included. Was having troubles with total rows in tablesaw.js so that was why this was implemented. Not sure if total rows are chill now with just datatables.js. Need to check! haha

EDIT: Forgot to mention that you'll need to modify the columnDefs.type targets with the right number of indexes specific to your report(s). Columns are 0 indexed.

UPDATE: Setting sScrollXInner to something larger that 100% will cause reports to crash on iOS browsers. Also, I don't have the fixed columns currently working in iOS either yet.
Additionally, to get horizontal scrolling to work on Android for reports with fixed columns, you have to use 2 fingers to scroll.

Any questions, let me know!

Insta-make any of your HTML or AHTML reports far better than they were... lol

This message has been edited. Last edited by: CoolGuy,

quote:

Originally posted by GavinL:

quote:

@CoolGuy said: I would love to believe IBI would be bringing the text editor back in the 8.2 release

They will not be bringing it back, even though, ever developer wants it there. My work around is simple, everything is done in FEX and the use of -HTMLFORM BEGIN/END

Since I do all my own HTML development anyway, I don't have to deal with half of their issues.

As recently as this morning, I had to hack the HTML code that App Studio was generating for a project I'm working on. I wanted to remove a label component from within a panel and I could not click on it to select it. There is a drop down control in App Studio to select an element by name (ID), but selecting that way didn't work, either.

My solution was to edit the HTML directly and remove all references to the label. That fixed the problem, but of course now I get nag messages every time I open the HTML app saying what a naughty boy I was for using my brain to word around an App Studio bug.

This is not the first time I've had to do this, either.