How to permenantly disable a submit input button even after refresh HTML JQUERY PHP

Question

Actually, I am making a table of to-do tasks, beside each task title there is a virtual submission form, with only a submit input button, when it's clicked, a data is inserted into the database using the $_POST[] method. What I need is that after submission, the user must not be able to submit the same task another time, since each task must be done by the user only one time. So I need to let the specific submit button of the task the user made, to get DISABLED PERMANENTLY!. In my approach, the button is being disabled ONCE I'm submitting the task, but after REFRESHING/RELOADING the page, the button is being ENABLED alone. WHICH NOT WHAT I NEED.. ANY APPRECIATED HELP?

Code of making a submit button beside each task (so many forms with many submit button is being created, I differ between them by their ID=(incremental i) and NAME=(id of task, in order to retrieve it by post method) ) :

              <?php
              $membergroup=$_SESSION['membergroup'];
              $sql="select * from taskstable where task_group_name=\"$membergroup\" ";
              $result2=mysqli_query($db,$sql);[![enter image description here][1]][1]
              $i=0;


              while($taskstable=mysqli_fetch_array($result2))
              {

                $taskPoints=$taskstable['task_points'];

                $taskID=$taskstable['task_id'];
                print"
              <tr>
                <td>".$taskstable['task_title']."</td>
                <td >".$taskstable['task_description']."</td>
                <td style=\"text-align:center;\">".$taskstable['task_points']."</td>
                <td>
                    <form action=$pagename method=\"post\"  enctype=\"multipart/form-data\">
                    <input type=\"submit\" id=\"".$i."\" name =\"$taskID\" class=\"form-control\" value=\"إرسال\" style=\"background-color:#2b3062;width:85%;margin:auto;float:none;color:white;text-align:center;\">
                    </form>


                </td>
              </tr>
              ";
              $i++;}

              ?>

And then, the code of checking whether any of the submit task buttons is being clicked, by post method.

  $sql5="SELECT * from taskstable where task_group_name='$membergroup' ";
  $result5=mysqli_query($db,$sql5);
  while($row=mysqli_fetch_array($result5)){

  $taskID2=$row['task_id'];

if(isset($_POST[$taskID2])) {

    $query = "select * from taskstable where task_group_name='$membergroup' AND task_id='$taskID2'";
    $result7 = mysqli_query($db,$query);
    $row2=mysqli_fetch_array($result7);

    $taskTitle2=$row2['task_title'];
    $oneTaskPoint=$row2['task_points'];


    $sql6="INSERT into tasksubmitted(member_username,task_title,task_group_name) VALUES('$uname',N'$taskTitle2','$membergroup');";
    $result6=mysqli_query($db,$sql6);

    if(!$result6)
    echo "<script language='JavaScript'>alert('Error in the query!');</script>";
            else
            {
              $memberPoints+=$oneTaskPoint;
              $flag=true;
              echo"<script language='JavaScript'>$(\"input[name='$taskID']\").prop('disabled',true)</script>";
         }


}

}

I haven't looked at your code, but the answer I immediately thought of is use localstorage. Save something in localstorage to tell your page not to re-enable submit — ControlAltDel, Apr 16 '20 at 22:59
I am trying this approach. Thanks for the suggestion! @ControlAltDel — Tarek AS, Apr 16 '20 at 23:30

score 0 · Accepted Answer · answered Apr 16 '20 at 23:52

You're saving the fact that the task has been submitted to the database. So now what you need to do is to query the same database when you're generating the page in PHP (your first code snippet). And if the task is done, add disabled="disabled" attribute to the submit button.

$title_esc = mysqli_real_escape_string($taskstable['task_title']);
$group_esc = mysqli_real_escape_string($membergroup);
$query = "SELECT * FROM tasksubmitted WHERE task_title=$title_esc AND task_group_name=$group_esc";

(note, I'm not 100% sure about the logic you're implementing, so you might need to adjust the query a bit)

Run that query and if it returns something, this mean the task has been done and you need to add disabled attribute as described above (or just skip the submit button altogether).

This approach is much more reliable than localstorage, since it will work even if user moves to another computer or uses different browser.

exactly that's what I needed! thanks , it worked :) – Tarek AS Apr 17 '20 at 09:47 — Tarek AS, Apr 17 '20 at 09:47

How to permenantly disable a submit input button even after refresh HTML JQUERY PHP

1 Answers1