Results in words with space don't show in php gallery-CodePudding

I'm creating a gallery in php, where it has a filter divided into categories. But when a word has a space it doesn't show the associated images. I'm working on two tables, one that creates the categories and the other that is from the gallery.

This is my code and the sql queries:

Querys:

$sql = "selec categoria AS categoria_formatted from cat_lar";
$galerialar = $connect->query($sql);
$sql = "select foto,categoria_lar from galeria_lar,cat_lar  Where categoria_lar=categoria";
$galerialarconde = $connect->query($sql);

Code:

<div >
    <div >
        <div >
        <div align="center">
        <button  data-filter="all">All</button>
        <?php mysqli_data_seek($galerialar, 0);
        
        while( $galerialarc = $galerialar -> fetch_assoc()){ ?>
            <button  data-filter="<?php echo $galerialarc['categoria_formatted']?>"><?php echo $galerialarc['categoria_formatted']?></button>
        <?php } ?>
        </div>
        
        <br/>
        <?php 
        while( $galerialarc = $galerialarconde -> fetch_assoc()){ ?>
        <div >
            <a  rel="ligthbox" href="admin/galeria/uploads/<?php echo $galerialarc['foto']?>">
                <img  alt="" src="admin/galeria/uploads/<?php echo $galerialarc['foto']?>" width="150px" />
            </a>
        </div>
        <?php }?>




        </div>
    </div>
</div>

SCRIPT:

<script>
$(document).ready(function(){

    $(".filter-button").click(function(){
        var value = $(this).attr('data-filter');
        
        if(value == "all")
        {
            $('.filter').show('1000');
        }
        else
        {
            $(".filter").not('.' value).hide('3000');
            $('.filter').filter('.' value).show('3000');
            
        }

        if ($(".filter-button").removeClass("active")) {
            $(this).removeClass("active");
        }
        $(this).addClass("active");
    });
});
/*  end gallery */

$(document).ready(function(){
    $(".fancybox").fancybox({
        openEffect: "none",
        closeEffect: "none"
    });
});
   
</script>

Can they help me? Because I've already tried to put the words with "_" and replace and it remained the same

CodePudding user response：

You need to do the string replace on the gallery identifier as well as the button identifier. Can you provide the code of how you output the gallery images?

<?php
mysqli_data_seek($galerialar, 0);

$records = [];
while($galerialarc = $galerialar->fetch_assoc()){
    $records[] = $galerialarc;
}

foreach($galerialarc as $record){ 
    $formatted = str_replace(' ', '_', $record['categoria_formatted']);
?>
    <button  data-filter="<?php echo $formatted; ?>"><?php echo $record['categoria_formatted']?></button>
<?php } ?>
</div>

If its this line, then wrap it in the string replace too.

$galerialarc['categoria_lar']

str_replace(' ', '_', $galerialarc['categoria_lar'])

CodePudding user response：

As you suggest yourself, the image URLs can't contain whitespaces. If you already tried to replace whitespaces with underscores (_) , remember to upload the image files with that name and replace the foto url in the database with the new images.

If it doesn't work, try to investigate where exactly the problem occurs. Is the queries returning the right results (try to var_dump() the result and see if they are missing. If you think the problem happends in the HTML, try using your "inspect" feature in your browser and see if a source URL is provided for the image element and check if this URL really has an image.