Responsive Report on website

  • 0
  • 1
  • Question
  • Updated 1 year ago
  • In Progress
Hello,

We have multiple reports pushing to our website from QuickBase i.e. Empowerla.org/anc.

Our website is responsive, however the reports are not. They get cut off on mobile devices. Is there any way of modifying the code to make it responsive?


<script lang="javascript" src="//lacity.quickbase.com/db/bjk6edj7j?a=API_GenResultsTable&qid=107&ticket=8_dgmr75xg9be_bz64iy_datb_a_u7w7fbyvvqvfcwizxkzu2z5b2cczuae3qf9kbscsasj5scnbrtga&jht=1"></script>
<h2>Board Members</h2>
<table cellpadding="1" bgcolor="2f95d0">
<tbody>
<tr>
<td><script lang="javascript">qdbWrite();</script></td>
</tr>
</tbody>
</table>


Thank you,
Photo of Sevak

Sevak

  • 40 Points

Posted 1 year ago

  • 0
  • 1
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 28,234 Points 20k badge 2x thumb
The API method API_GenResultsTable generates HTML that has minimal inline styling attributes and is intended to be used with a short <style> element (which you are not using). See the docs:

https://help.quickbase.com/api-guide/index.html#gen_results_table.html#TOC_Embedding_a_QuickBase

As a result you are substantially not setting the style of the report nor are you getting the responsive behavior you have in other parts of your Wordpress  web site.

When I poke around your website I see this Neighborhood Council table which is displaying non-QuickBase data which I assume was intended to display in a responsive manner (I am not sure I would agree that this is responsive):



http://empowerla.org/councils/

I note that this <table> is wrapped in a <div> with a class which I would assume is the mechanism that was intended to make this table responsive:
<div class="fusion-table table-1">
<table width="100%">
...
</table
</div>

So perhaps you need to wrap the table generated through using API_GenResultsTable in a similar <div> with an appropriate class. I think this is the place to investigate but I have to hedge a bit because I don't really think you site is what I would call 100% responsive.