Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Whats the best way to remove the missing image icon?

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #161242
    Anonymous
    Inactive

    I use an admin panel to upload new blog posts along with an image using PHP. Although if i decide not to include an image the missing image icon appears on the site because i didn’t upload an image, the tag is still there without a url when i don’t upload an image. I can hide the missing image icon using jquery like this.

    //hide missing images icon
    $("img").error(function(){
        $(this).parent().hide();
    });
    

    This works but not perfectly. Sometimes the image doesn’t hide and you can actually still see it for a split second until it disappears. So whats the best way to remove the missing image icon when i don’t upload an image to my article?

    #161254
    __
    Participant

    I use an admin panel to upload new blog posts along with an image using PHP … whats the best way to remove the missing image icon when i don’t upload an image to my article?

    Without knowing anything at all about how your admin panel works (or even which “admin panel” it is), there is no way to answer. Please explain further.

    It will certainly depend on how your system works, and how much you know/understand/can learn about it. But in the most basic terms, you can either:

    1) change the script to only display an image if you upload one (this makes the most sense, and, honestly, is what I would expect your script to do already)

    2) always upload an image (perhaps a tiny, transparent image if you really don’t want one; less desirable, but it will “work”)

    #161255
    Anonymous
    Inactive

    Basically this is the article upload script that also uploads the image along with it.

        <?php
    
        include "../../php/db_connect.php";
    
        if(isset($_POST['submit'])) {
            $title = $_POST['title'];
            $image = $_FILES['image']['name'];
            $image_tmp = $_FILES['image']['tmp_name'];
            $content = mysql_real_escape_string($_POST['ckeditor1']);
            $written_by = $_POST['written_by'];
            $written_on = date('d-m-y');
            $category = $_POST['category'];
    
            if($title=='' or $content=='' or $written_by=='' or $category=='') {
                echo "<script>alert('You left empty fields');</script>";
                exit();
            }
            else {
                move_uploaded_file($image_tmp,"../../img/article_img/$image");
                $insert_query = "insert into articles (title, image, content, written_by, written_on, category) values('$title', '$image', '$content', '$written_by', '$written_on', '$category')";
            }
            if(mysql_query($insert_query)) {
                header("Location: ../submit_article.php");
            }
        }
    
        ?>
    
    
    This is the article.php page that shows the article itself along with the image uplaoded.
    
    <div class="content_aligner">
                    <div class="content_wrapper shadow">
                        <?php
                            //get all row aspects and shit
                            $sql = mysql_query("SELECT * FROM articles WHERE id='$id'");
                            while($row = mysql_fetch_array($sql)) {
                                $title = $row['title'];
                                $image = $row['image'];
                                $content = $row['content'];
                                $written_by = $row['written_by'];
                                $written_on = $row['written_on'];
                                $category = $row['category'];
                        ?>
    
                        <div class="content_title shadow" style="margin-bottom:20px"><h1><?php echo $title;?></h1></div>
                        <div class="content_text_aligner">
                            <div><img src="img/article_img/<?php echo $image?>" class="article_preview_img full_article_img" class="article-preview-image-preview"/></div>
    
    #161268
    mcjohnst
    Participant

    Add a check for the returned value for the image. If you get, what I’m assuming is a filename as a string, spit it out in the markup otherwise move do nothing.

    Something like this:

                            <?php if($image != '') { ?>
                        <div><img src="img/article_img/<?php echo $image?>" class="article_preview_img full_article_img" class="article-preview-image-preview"/></div>
                        <?php } ?>
    

    Assuming that removing the div won’t break anything else.

    #161300
    Anonymous
    Inactive

    Thanks man.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.