How to get file using PHP native functions and Android

Question

I did a function in private section of my website, to get and display some file of a repository.

Below is the function I did :

function getFilesChantier($devis, $cp) {
        //        Si dossier cp n'existe pas on le créé
        if (!file_exists(_DOCS_ . 'C' . $cp)) {
            mkdir(_DOCS_ . 'C' . $cp, 0777, true);
            fopen(_DOCS_ . 'C' . $cp . '/index.html', w);
        }
        if (!file_exists(_DOCS_ . 'C' . $cp . '/' . $devis)) {
            mkdir(_DOCS_ . 'C' . $cp . '/' . $devis, 0777, true);
            fopen(_DOCS_ . 'C' . $cp . '/' . $devis . '/index.html', w);
        }

        //On liste les fichiers pdf
        $repertoire = _DOCS_ . 'C' . $cp . '/' . $devis;
        if ($dossier = opendir($repertoire)) {
            while (false !== ($fichier = readdir($dossier))) {
                if ($fichier != '.' && $fichier != '..' && $fichier != 'index.php' && $fichier != 'index.html' && $fichier != 'Thumbs.db') {
                    $nb_fichier++; // On incrémente le compteur de 1
                    $retour[$nb_fichier]['name_file'] = str_replace('/var/www/sp-batiment.com/htdocs/docs/C' . $cp . '/' . $devis . '/', '', $repertoire . '/' . $fichier);
                    $retour[$nb_fichier]['url_file'] = str_replace('/var/www/sp-batiment.com/htdocs/', '', $repertoire . '/' . $fichier);
                    $retour[$nb_fichier]['nb_file'] = $nb_fichier;
                    $retour[$nb_fichier]['date_file'] = date("F d Y H:i:s.", filectime($repertoire . '/' . $fichier));
                }
            }
        }
        return $retour;
    }

All works fine in all browsers.

Below is the rendering of my website:

but when we turn to a phone (Android Samsung), it does not work on Google Chrome browser, it displays nothing.

I don't know if something is wrong with my function, or is it the fact that it is calling on a telephone ?

The page called is the same, just the browser change (the first is classic Google Chrome on a computer), the other is a Samsung Galaxy with Google Chrome.

Edit

I use Bootstrap, below is the code of my table:

<div class="col-md-12">
    <h3>Mes documents</h3>
    <table class="table table-bordered">
        <thead>
            <tr>
                <th>#</th>
                <th><i class="fa fa-calendar"></i> Date</th>
                <th class="text-center">Type</th>
                <th>Fichier</th>
                <th>Options</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td nowrap="">1</td>
                <td nowrap="">17-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> compément-de-devis-1.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">2</td>
                <td nowrap="">04-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> autorisation-changement-de-façade.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">3</td>
                <td nowrap="">03-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> devis-initial.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">4</td>
                <td nowrap="">03-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> plan-du-batiment.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">5</td>
                <td nowrap="">03-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> facture-acompte-n-1.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
        </tbody>
    </table>                                   
</div>

Donkey

Can you provide the html? Are you using some responsive layout (like bootstrap for example?) Without looking at your html it will be hard to help. My guess is that you have some class in your html that hides the data in your table to be visible in small-width browsers (mobiles) – Reseta

yes I do use bootstrap, I will do an update with the code.Thank you for your quick reply – Donkey

@StanislasPiotrowski Can you update your question with your HTML ? – Mace

Most likely Bootstrap is hiding the table rows for you because it would be messy at that screen size. You might want to take a look at the No More Tables approach to making tables work on small screens. – Aldas

Try changing the size of your window on your web-browser, and see what happens. Bootstrap has multiple table options, which are you using? You will get no answer for your bounty unless you provide your html, as no one will be able to answer it properly. – Stupe

hello, I did update of my code, I tried to swhich the screen horizontally but it still empty. – Donkey

can we have the javascript code too please? most probably the issue is there. – Bannerol

brother its working fine test with Samsung duos... – Daggett

Answer 1

In your html code there is no issue as i run it in my mobile device and its working fine.

A small typo error tex-align to text-error in your code

You can inspect your html code in your mobile google chrome browser through your PC. Check this links

https://developers.google.com/web/tools/chrome-devtools/debug/remote-debugging/remote-debugging?hl=en

From it you can check that the table row are inflating from your php code or is there any problem with your html code

Hope this will help

Lithotrity

Answer 2

The problem can't be in PHP code (it interprets on server, not on device), it is in your HTML or Javascript code. You didn't provide it so I can't help to debug. But you can try resizing window to phone's screen size in Chrome and you will probably get the same result. Also in desktop Chrome, you can press F12, press "Toggle Device" button and select appropriate device.

Update: I posted HTML code you provided to jsfiddle (sorry for duplicating your code in answer but SO doesn't allow link to jsfiddle without code).

<div class="col-md-12">
    <h3>Mes documents</h3>
    <table class="table table-bordered">
        <thead>
            <tr>
                <th>#</th>
                <th><i class="fa fa-calendar"></i> Date</th>
                <th class="text-center">Type</th>
                <th>Fichier</th>
                <th>Options</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td nowrap="">1</td>
                <td nowrap="">17-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> compément-de-devis-1.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">2</td>
                <td nowrap="">04-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> autorisation-changement-de-façade.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">3</td>
                <td nowrap="">03-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> devis-initial.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">4</td>
                <td nowrap="">03-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> plan-du-batiment.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
            <tr>
                <td nowrap="">5</td>
                <td nowrap="">03-08-2016 </td>
                <td nowrap="" class="text-center"><span class="label label-danger" style="text-transform:uppercase;tex-align:left"><i class="fa fa-file-pdf-o"></i></span></td>
                <td nowrap=""> facture-acompte-n-1.pdf</td>
                <td nowrap="">
                    <form action="php/download.php" method="post">
                        <button class="btn btn-dark btn-xs"><i class="fa fa-cloud-download"></i> Télécharger</button>
                    </form>
                </td>
            </tr>
        </tbody>
    </table>                                   
</div>

It looks fine and is displayed in my chrome on mobile devices. Are you sure that there is nothing more then this HTML? Some kind of extra CSS and JS besides standard bootstrap, for example.

Colorfast

I'm sure there is no extra CSS or JS, when I do a var_dump of the answer in chrome I got something but in mobile device t is empty. This is weird behavior. – Donkey

Answer 3

Reason 1:

You havent provided your php codes for that output process (from PHP) for that HTML parts. Although in PHP there exists classes to detect BROWSER, there is a very little chance that you accidentally used that in your output process. However, lets provide that part, or check it yourself.

Reason 2:

As you say, that while "toggling" the device, you see them, then it means there is CSS problem. Check if elements have css classes/styles like @media max-width:... or overflow:hidden or like them, which causes the table to be hidden.

Reason 3:

Although you say, that there is no more codes in page, i doubt there may be some Javascript code, that may cause problems. Many times, JS tables are dynammically loaded after Page-Load, and maybe in the device browser, it has some problems. If you have shared all your PHP/HTML codes you use for the project, then it would have been easier to detect the problem.

Morentz

Answer 4

Add this code in your page to makes it more clear for mobile user

<style>
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	td:before { 
		position: absolute;
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	
	td:nth-of-type(1):before { content: "#"; }
	td:nth-of-type(2):before { content: "Date"; }
	td:nth-of-type(3):before { content: "Type"; }
	td:nth-of-type(4):before { content: "Fichier"; }
	td:nth-of-type(5):before { content: "Options"; }
	
}
</style>

Perplexity

Answer 5

I have check your html code in browser at desktop its working fine.. As like desktop, I am also test it mobile view, table is responsive but their column still stable Due to Bootstrap..

I got your issue, it's not any browser issue... Check your html properly and write it in proper bootstrap html table form. The main thing you just cross testing on html that all tags are closed..

In Mobile view some of the tags are open but not closed , Cause this table overlapped itself . You just check it, In mobile view .. I think it may be happen with php loop (just check all thing ).

Tasset