How can I send information with HTML to PHP without using forms?

user_18252180 0
Viewed 42

I am trying to make an Instagram like website in order to enhance my coding skills. I am echoing the image and a form with a button in it if the posted picture belongs to the logged-in user to delete the posted picture.

Here is the index.php:

<?php
require_once "includes/header.php";
?>
<?php
if (isset($_SESSION["sessionId"])){
    echo "<br><br><br>";
    $sql="SELECT * FROM post ORDER BY id DESC ";
    $stmt=mysqli_stmt_init($conn);
    if (!mysqli_stmt_prepare($stmt, $sql)){
        echo "SQL HATASI. SIÇTIK";
    }
    else{
        mysqli_stmt_execute($stmt);
        $result= mysqli_stmt_get_result($stmt);
        while ($row=mysqli_fetch_assoc($result)){ //this is where I show the user posted pictures.
            $a= $row["file_name"];
            $b=$row["username"];
            $filepath="file_upload/upload/$a"; //this is where the uploaded pictures are stored.
            $postID=$row["id"];
            if ($row["username"]==$_SESSION["sessionUser"]){
                
                echo "<img src='$filepath' width='60%' height='40%'>"."<br>"."This picture was posted by ". $b ."<form action='file_upload/delete.php?postid=$postID' method= 'GET'><button type='submit' name='delete'>delete </button></form>".$postID."<hr>";
                

            }
            else{
                echo "<img src='$filepath' width='60%' height='40%'>"."<br>"."This picture was posted by ". $b ."<hr>";

            }
           
        }
    }

}
else{
    echo "Lütfen giriş yapın.";
    
    require_once "includes/footer.php";

}
?>

What I am trying to do with the:

 if ($row["username"]==$_SESSION["sessionUser"]){
                
                echo "<img src='$filepath' width='60%' height='40%'>"."<br>"."This picture was posted by ". $b ."<form action='file_upload/delete.php?postid=$postID' method= 'GET'><button type='submit' name='delete'>delete </button></form>".$postID."<hr>";
                

            }

Part is, I check whether the logged-in user posted that picture by checking if the username from the database equals to the username which is set by the super global SESSION.

Then I am using "<form action='file_upload/delete.php?postid=$postID' and triggering the upload.php while setting the $_GET["postid"]=$postID. What $postID is basically the auto incremented ID which is set while uploading the file and inserting the file name to the database. (Database consists of 3 columns: ID, file_name and username)

I am trying to get the information of which one of the delete buttons is pressed so that I can use that information while I am sending a query in the delete.php thus deleting the correct picture. I am trying to get the information of the ID of the post.

Here is how I am using that information in the delete.php:

<?php
session_start();
require_once "../includes/database.php";
if (isset($_GET["delete"])){
    $postid=$_GET["postid"];
    $sql="DELETE FROM post WHERE id=?";
    $stmt=mysqli_stmt_init($conn);
    if (!mysqli_stmt_prepare($stmt,$sql)){
        header("Location: ../index.php?sqlerror");
        exit();
    }

    else if (empty($postid)){
        header("Location: ../index.php?didntwork");
        exit();
    }
    else{
        mysqli_stmt_bind_param($stmt,"s",$postid);
        mysqli_stmt_execute($stmt);
        unset($_GET["postid"]);
        
        header("Location: ../index.php?deletesuccess&$postid");
        exit();

    }
    unset($_GET["postid"]);
}

However, it keeps me redirecting to ../index.php?didntwork because the $postid variable is empty, even though I set it to $postid=$_GET["postid"]. This means I can not get the information of the ID of the post when the user clicks to the delete button, in other words the "<form action='file_upload/delete.php?postid=$postID' part is not working the way I want.

How can I get the information, and is there another way to determine which one of the delete buttons is pressed? I am uploading the image of how the index.php looks like: here is the image

forms php
1 Answers

I'd be tempted, as I mentioned, use AJAX rather than several inline forms - it is easy enough to assign the relevant properties from the recordset to the image and use the image itself ( or other element ) to fire the ajax request. I could not test this but I hope it gives an idea

<?php

    session_start();
    require_once "includes/header.php";
    
    if( isset( 
        $_SESSION["sessionId"],
        $_SESSION["sessionUser"]
    )){
        # use a regular query where there are no parameters/variables
        $sql="SELECT * FROM post ORDER BY id DESC ";
        $res=$conn->query( $sql );
        
        while( $row=$res->fetch_assoc() ){
            
            $filepath="file_upload/upload/" . $row["file_name"];
            
            # default empty values
            $postedby='';
            $classname='';
            $datapid='';
            $datauser='';
            $bttn='';
            
            
            
            # add content to the variables for this user 
            if( $row["username"]==$_SESSION["sessionUser"] ){
                $postedby='<div>This picture was posted by ' . $row["username"] . '</div>';
                $classname='class="user-img"';
                $bttn=sprintf('<button type="button" data-postid="%s" data-user="%s" value="Delete">', $row["id"], $row["username"] );
            }
            
            # print out the image and other stuff
            printf('<img src="%s" %s width="60%" height="40%" />%s %s', $filepath, $classname, $postedby, $bttn );
        }
        

    } else {
        require_once "includes/footer.php";
    }
?>

Then bind event handlers to any/all buttons rendered

<script>

    let fd=new FormData();
    
    document.querySelectorAll('img.user-img + button[ data-postid ][data-user]').forEach(img=>img.addEventListener('click',function(e){
        fd.set('postid',this.dataset.postid);
        fd.set('username',this.dataset.user);
        fd.set('delete',true);
        
        fetch( 'file_upload/delete.php', { method:'post',body:fd } )
            .then( r=>r.text() )
            .then( text=>{
                alert( text )
            })
    }))
</script>

And modify the delete.php script to use POST rather than GET.

<?php

    session_start();

    if (isset(
        $_POST['delete'],
        $_POST['postid'],
        $_POST['username']
    )){

        require_once '../includes/database.php';

        $sql='delete from `post` where `id`=?';
        $stmt=$conn->prepare($sql);
        $stmt->bind_param('s',$_POST['postid']);
        $stmt->execute();
        $stmt->close();

        exit( header( sprintf('Location: ../index.php?deletesuccess&%s',$postid ) ) );
    }
    
?>
user_36036810
Related