Problema richiamo funzione js nel file php

GattoFelice · 03-06-2021, 12:52

Ciao a tutti, sono giorni che non riesco a risolvere il seguente problema:

Ho un file chiamato home.php che comunica con il mio database creato tramite phpmyadmin. Il database ha la seguente tabella: categoria(nome_categoria, username_utente, icona) dove appunto nome_categoria è il nome dato dall'utente alla categoria, username_utente è l'utente che ha creato quella determinata categoria e icona è l'icona che ha scelto.
La mia home.php andrà a leggere nel database la tabella categoria e filtra solamente le categorie create dall'utente loggato in quel momento, in modo che ogni utente vedrà nella sua home.php solo le categorie da lui create.
Queste categorie le voglio posizionare in modo che formino un cerchio. Ho quindi un file home.js che contiene appunto la funzione per fare questo:

home.js

Codice:

var list = $("#list");
var updateLayout = function(listItems){
	for(var i = 0; i < listItems.length; i ++){
		var offsetAngle = 360 / listItems.length;
		var rotateAngle = offsetAngle * i;
		$(listItems[i]).css("transform", "rotate(" + rotateAngle + "deg) translate(0, -470px) rotate(-" + rotateAngle + "deg)")
	};
};

La funzione updateLayout funziona correttamente, avevo fatto una prova tramite un file home.html senza la presenza del database, in cui direttamente io gli passavo le informazioni da inserire, ovvero nel file js avevo:

Codice:

var list = $("#list");

var updateLayout = function(listItems){
	for(var i = 0; i < listItems.length; i ++){
		var offsetAngle = 360 / listItems.length;
		var rotateAngle = offsetAngle * i;
		$(listItems[i]).css("transform", "rotate(" + rotateAngle + "deg) translate(0, -470px) rotate(-" + rotateAngle + "deg)")
	};
};
var x="<li class='list-item'><a href='formCategoria.php'><img type='buttom' id='click-area' class='card-icone shadow-lg p-3 mb-5' src='/icone/add.png'></a></li>";
var y="<li class='list-item'><a href='categoria.html'><img class='card-icone shadow-lg p-3 mb-5' src='/icone/medication.png'></a></li>";
var z="<li class='list-item'><a href='categoria.html'><img class='card-icone shadow-lg p-3 mb-5' src='/icone/book.png'></a></li>";
var k="<li class='list-item'><a href='categoria.html'><img class='card-icone shadow-lg p-3 mb-5' src='/icone/skincare.png'></a></li>";
list.append(x);
list.append(y);
list.append(z);
list.append(k);
var listItems=$(".list-item");
updateLayout(listItems);

Ora avendo il file home.php invece di home.html, ovviamente nel file home.js non gli passo direttamente io le cose da aggiungere alla lista.
Il file home.php è il seguente:

Codice:

<?php
// START THE SESSION
session_start();
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>NomeSito</title>

    <!-- Bootstrap core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- my CSS -->
    <link href="css/home.css" rel="stylesheet">
    
  </head>
  <body>

  <?php
            $db = mysqli_connect('localhost','root','','DBsito');
            if (!$db)
            {
              die('Could not connect to database: ' . mysqli_error());
            }
  
            $db_select = mysqli_select_db($db, 'DBsito');
            $username = $_SESSION['username'];
  
            $categorie = mysqli_query($db, "SELECT * FROM categoria WHERE BINARY categoria.user_utente = BINARY '$username'");

  ?>
  <div class="row">
          <ul id="list">

        <?php    
            /* fetch associative array */
          while ($row = mysqli_fetch_assoc($categorie)) {
              echo '
              <li class="list-item"><a href="categoria.php?categoria='.urlencode($row["nome_categoria"]).'">
              <img class="card-icone" shadow-lg p-3 mb-5 src="img/upload/'. $row["icona"] . '" &nbsp;  >
              </a>
              ';             
              }
              ?>
              <script type="text/javascript" src="js/home.js"></script> 
          </li>
          </ul>
          </div>

      <?php
      //SET SESSION VARIABLES
      $_SESSION["username"] = $username;
      ?>
                              
  </body>
</html>

Il mio problema quindi è: come faccio adesso a prendere le informazioni che vengono ricavate leggendo nel database inserendole in una lista per poi richiamare la funzione updateLayout?
Perché la mia home.php effettivamente legge nel database, ricava tutte le giuste informazioni ma poi se richiamo updateLayout non succede niente perché effettivamente non ho una lista piena come succedeva invece prima nella versione html.

Non so se mi sono spiegata, qualcuno riesce ad aiutarmi? Non riesco a sbloccarmi da questa situazione

Kaya · 03-06-2021, 15:59

A naso hai il "</li>" che si trova fuori dal ciclo loop....
Mettilo giusto e riprova, nel caso incolla l'output generato e non il sorgente, altrrimenti non si capisce.
E comunque con la console (tasto F12) questi errori te li fa vedere

03-06-2021, 15:59	#2
Kaya Senior Member Iscritto dal: Apr 2005 Messaggi: 3299	A naso hai il "</li>" che si trova fuori dal ciclo loop.... Mettilo giusto e riprova, nel caso incolla l'output generato e non il sorgente, altrrimenti non si capisce. E comunque con la console (tasto F12) questi errori te li fa vedere

Strumenti
Mostra una versione stampabile Invia questa pagina per email