Remove value on click

Question

I want to create a javascript that will change the value of anotif to 0 once clicked:

Approved:<?php if($anotif<1){
    echo 0;
} else { 
    echo '<a class="anotif" onClick="validator()" href="?anotif">'.$anotif.'</a>';
} ?><br/>

But I am not sure how do that, considering that I'm so new in javascript. I've googled around a bit but I wasn't able to find the answer.

function validator(){
    if(document.anotif.clicked){ // I'm not really sure if this is correct.
        // if clicked, change value to zero
}

To be more precise, I want it to look like this once clicked: From: Approved:3 To: Approved:0

Approved:<?php if($anotif<1){
    echo 0;
} else { 
    echo '<a class="anotif" onClick="validator()" href="?anotif">'.$anotif.'</a>';
} ?><br/>

This code will lead me to ?anotif for me to view some data from the database in a table. Once approved:

is clicked, it must be set to zero at the same time I move to the other page.

The problem is it requires refreshing for it to be set to 0 by the system.

Here is the rest of the code:

$firstname =  getuserfield('txtFname');
$lastname = getuserfield('txtLname');
echo 'Hello '.$firstname.' '.$lastname.'.<br/>';

$anotif = 0;
$dnotif = 0;
$anotif = $anotif + getuserfield('approved_notif');
$dnotif = $dnotif + getuserfield('disapproved_notif');
?>
<h3>Notifications:</h3>
Approved:<?php if($anotif<1){echo 0;} else { echo '<a class="anotif" onClick="validator(this);" href="?anotif">'.$anotif.'</a>';}?><br/> //problem is over here
<?php 
if(isset($_GET['anotif'])) {
    $query = "SELECT * FROM hrf_leave WHERE empid = '$empid' AND formStatus = 1 AND checked = 0";
    $query_run = mysql_query($query) or die($query."<br/><br/>".mysql_error());
    echo "<table border=1>
    <tr>
    <th>Type of Leave</th>
    <th>Specific Reason</th>
    <th>Date From</th>
    <th>Date To</th>
    <th>Number of Days</th>
    </tr>";
    echo "<tr>";
    while($record = mysql_fetch_array($query_run)){ 
        $leave_id = $record['leave_id'];
        echo "<td>" . $record['type_of_leave'] . "</td>";
        echo "<td>" . $record['specific_reason'] . "</td>";
        echo "<td>" . $record['date_from'] . "</td>";
        echo "<td>" . $record['date_to'] . "</td>";
        echo "<td>" . $record['num_of_days'] . "</td>";
        echo "</tr>";
        $query2 = "UPDATE hrf_leave SET checked=1 WHERE leave_id = $leave_id";
        if($query_run2 = mysql_query($query2)){ 
            $anotif = 0;
            $query3 = "UPDATE hrms_emp_info SET approved_notif=$anotif WHERE empid = $empid";
            if($query_run3 = mysql_query($query3)){
            }
        }
    }
    echo "</table>";
}
?>
Disapproved:<?php if($dnotif<1){echo 0;} else { echo '<a href="?dnotif">'.$dnotif.'</a><br/>';} ?> //and here
<?php
if(isset($_GET['dnotif'])) {
    $query = "SELECT * FROM hrf_leave WHERE empid = '$empid' AND formStatus = 2 AND checked=0"; 
    $query_run = mysql_query($query);
    echo "<table border=1>
    <tr>
    <th>Type of Leave</th>
    <th>Specific Reason</th>
    <th>Date From</th>
    <th>Date To</th>
    <th>Number of Days</th>
    </tr>";
    echo "<tr>";
    while($record = mysql_fetch_array($query_run)){
        $leave_id = $record['leave_id'];
        echo "<td>" . $record['type_of_leave'] . "</td>";
        echo "<td>" . $record['specific_reason'] . "</td>";
        echo "<td>" . $record['date_from'] . "</td>";
        echo "<td>" . $record['date_to'] . "</td>";
        echo "<td>" . $record['num_of_days'] . "</td>";
        echo "</tr>";
        $query2 = "UPDATE hrf_leave SET checked=1 WHERE leave_id = $leave_id";
        if($query_run2 = mysql_query($query2)){ 
            $dnotif = $dnotif-1;
            $query3 = "UPDATE  hrms_emp_info SET disapproved_notif=$dnotif WHERE empid = $empid";
            if($query_run3 = mysql_query($query3)){ 
            }
        }
    }
    echo "</table>";
}

Upvotes: 0

Views: 115

Answer 1

You could change your anchor a bit like this:

<a class="anotif" onClick="return validator(this)" href="?anotif">

Then change the validator() function like this:

function validator(element)
{
    // element is clicked already, so you can change its value

    element.innerHTML = '0';

    // prevent click from changing page
    return false;
}

However, the real problem here is that the page will be changed to ?anotif and whatever you changed will be wasted effort. Updated the code with a way to prevent the click from changing the page and just reducing the number to '0'.