Unresponsive form

satyriasis

Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem: Hello, this is my form (made with datatables in formidable) below. I am having trouble because when I check on mobile phone it is not responsive at all. What can I do?

<table id="moja" class="display" width="100%"> 
<thead>
<tr>
<th>Br</th>
<th>Termin</th>
<th>Stranka</th>
<th>Adresa</th>
<th>Kontakt</th>
<th>Usluga</th>
<th>Status</th>
<th>Total</th>
<th>Prethodni</th>
<th>Uredi</th>
</tr>
</thead>
<tbody>

<tr>
<td>1</td>
<td>Termin</td>
      <td>[1691] [1692]</td>
      <td>[su_lightbox type="inline" src="#karta" class=siviLink][1869], [1536][su_lightbox_content id="karta" class=siviLink]
[res_map address="[1536], [1869], Hrvatska" description="<a href='https://maps.google.com/?q=[1536],[if 1869 like="Zagreb"]Zagreb[/if 1869][if 1869 like="Sveta Nedelja"]Sveta Nedelja[/if 1869][if 1869 like="Sesvete"]Sesvete[/if 1869][if 1869 like="Zaprešić"]Zaprešić[/if 1869][if 1869 like="Samobor"]Samobor[/if 1869]'>[1536]</a><br>[1869]<br><a href='tel:[1540]'>[1540]</a>" icon="orange" iconsize="" style="1" scalecontrol="no" typecontrol="no" streetcontrol="no" locateme="no" zoom="12" zoomcontrol="yes" draggable="no" scrollwheel="no" searchbox="no" clustering="no" logging="no" poi="yes" fullscreen="no" popup="yes" tabfix="no" width="auto" height="200px" maptype="roadmap" refresh="yes" center="" key="AIzaSyDGdgWYaQ9Bd6vT0lssDRMr-wsKA1w2DSg"]<br><br>[/su_lightbox_content][/su_lightbox]</td>
<td>[1540][if 1928]<br>Dodatan broj:[1928][/if 1928]</td>
<td>[su_lightbox type="inline" src="#uredaj"][1880] [1843][if 1727] i [1727][/if 1727][if 1891] [1891][/if 1891][su_lightbox_content id="uredaj"][1880] [1891]: [1857] [if 1892]<br>[1892][/if 1892] [if 1893][1893][/if 1893] [if 1894][1894][/if 1894] [if 1895]<br>[1727] [1891]: [1895][/if 1895] [if 1732][1732][/if 1732] [if 1733][1733][/if 1733] [if 1731][1731][/if 1731][/su_lightbox_content][/su_lightbox]</td>
<td>[1546]</td>
<td>Total [su_lightbox type="inline" src="#ana"]ccc[su_lightbox_content id="ana"]Moze to brze[/su_lightbox_content][/su_lightbox]</td>
<td>[frm-stats id=1643 type=count user_id=current] / [1930] / [frm-stats id=1643 type=count user=[1643]]</td>
<td>[editlink label="Uredi"]|[deletelink label="Obriši" prefix="frm_del_container_"]</td>
</tr>

</tbody>
</table>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.11.3/css/jquery.dataTables.min.css">
<script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.flash.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.print.min.js"></script>
<script>
$('#moja').DataTable({
      language: {
         url: '//cdn.datatables.net/plug-ins/1.11.3/i18n/hr.json'
       },
       dom: 'Bfrtip',
       buttons: [
           { extend: 'copy', className: 'nectar-button medium regular extra-color-1  regular-button tableBtn' },
           { extend: 'csv', className: 'nectar-button medium regular extra-color-1  regular-button tableBtn' },
           { extend: 'excel', className: 'nectar-button medium regular extra-color-1  regular-button tableBtn' },
           { extend: 'print', className: 'nectar-button medium regular extra-color-1  regular-button tableBtn' }
       ] });
</script>

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

kthorngren

First please use Markdown to format your code.

You will need to add the Responsive Extension to your Datatables config.

Kevin

satyriasis

Can you please tell me what is Markdown? I cant understand from article

kthorngren

When you are leaving a comment there is a short description at the bottom that explains how to use the backticks for formatting the code:

Kevin

colin

Question also asked here, for efficiency, please only ask a question once,

Colin