delete a record on click using ajax

Question

I want to delete a record by passing dynamic value generated in while loop to ajax. I want to pass $ef value in jquery. (i.e)Delete sample hrms trail.doc file in onclick event of delete image. now onclick event of image tag doesn't show any action

 while($fet=mysql_fetch_assoc($sql1))
            {

              $file=$fet['f_name'];
              $ef=$fet['ef_id'];
               $next1 = basename($file);
              echo "<h3><a  class=doc  href='".$file."' title='".$file."' download><p style='margin-left:1cm;'>".$next1."</a>";
              echo '<img src="image/delete1.png" id=".$ef."width="10" height="10" title="Remove" onclick="javascript:myFunction();">';

            }

My jquery ajax code

           <script>
          function myFunction()
          {   
           var rmvfile=$("doc").val();
           $.ajax({
           type:'post',
           url:'hrms/delete_emp_file.php',
           data:{rmvfile: rmvfile},
           success:function(msg){
           if (msg.length> 0) {
               alert(msg);
                } }

            });
            }

enter image description here

php code in delete_emp_file.php

 $s=$_POST['rmvfile'];
 include "config.php";
 $echeck="delete from employee_file where ef_id='".$_POST['rmvfile']."'";
 $echk=mysql_query($echeck);
 $ecount=mysql_num_rows($echk);

 if($ecount>='1')
 {
  echo "file deleted";
 }

You haven't explained what problem you are having. Please edit your question to do so. — Patrick Evans
– Patrick Evans, Commented Jan 2, 2015 at 6:43
As a side note, you shouldn't be using the mysql_* functions anymore as they are deprecated. See the big red warning on php.net/manual/en/function.mysql-fetch-assoc.php — Seventoes
– Seventoes, Commented Jan 2, 2015 at 6:45
Your class name declaration is incorrect.echo "<h3><a **class=doc** href='".$file."' title='".$file."' download><p style='margin-left:1cm;'>".$next1."</a>"; — ℛⱥℐℰşℎ
– ℛⱥℐℰşℎ, Commented Jan 2, 2015 at 6:45
And in Ajax jQuery: var rmvfile=$("doc").val(); this should be var rmvfile=$(".doc").val(); — ℛⱥℐℰşℎ
– ℛⱥℐℰşℎ, Commented Jan 2, 2015 at 6:46
@ℛⱥℐℰşℎ you should post it as an answer not in comment. — Suchit kumar
– Suchit kumar, Commented Jan 2, 2015 at 6:48

ℛⱥℐℰşℎ · Accepted Answer · 2015-01-02 07:09:29Z

1

Try this one,

while($fet=mysql_fetch_assoc($sql1))
     {
        $file=$fet['f_name'];
        $ef=$fet['ef_id'];
        $next1 = basename($file);
        echo "<h3><a  class='doc'  href='".$file."' title='".$file."'><p style='margin-left:1cm;'>".$next1."</a>";
         echo '<img src="image/delete1.png" id=".$ef." width="10" height="10" title="Remove" onclick="javascript:myFunction();">';
     }

And your AJAX:

function myFunction()
 {   
     var rmvfile=$(".doc").val();
       $.ajax({
            type:'post',
            url:'hrms/delete_emp_file.php',
            data:{rmvfile: rmvfile},
            success:function(msg){
                   if (msg.length> 0) {
                             alert(msg);
                               } 
                       }
                });
 }

And in your delete_emp_file.php,

$echeck="delete from employee_file where ef_id='".$_POST['rmvfile']."'";

You can pass $s instead of $_POST['rmvfile']

$echeck="delete from employee_file where ef_id='$s'";

edited Jan 2, 2015 at 7:09

answered Jan 2, 2015 at 6:57

ℛⱥℐℰşℎ

3602 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

user4264796 Over a year ago

ya I left space there still having problem

ℛⱥℐℰşℎ Over a year ago

Can you check the Source of webpage in browser. Check if all the values are printing as per your requirements

user4264796 Over a year ago

in source page id value is printed as id=".$ef."

ℛⱥℐℰşℎ Over a year ago

Replace it with id="'.$ef.'"

user4264796 Over a year ago

script is not redirect to delete_emp_file.php

|

user2560539 · Accepted Answer · 2015-01-02 07:14:02Z

You want to pass the $ef variable so:

while($fet=mysql_fetch_assoc($sql1))
     {
        $file=$fet['f_name'];
        $ef=$fet['ef_id'];
        $next1 = basename($file);
        echo "<h3><a  class='doc' id=".$ef." href='".$file."' title='".$file."'><p style='margin-left:1cm;'>".$next1."</a>";
         echo '<img src="image/delete1.png" width="10" height="10" title="Remove" onclick="javascript:myFunction();">';
     }

Your code for Ajax

function RemoveFile(id)
 {   
       $.ajax({
            type:'post',
            url:'hrms/delete_emp_file.php',
            data:{rmvfile: id},
            success:function(msg){
                   if (msg.length> 0) {
                             alert(msg);
                               } 
                       }
                });
 }
$(".doc").on('touchstart click',function() {
var file_id = $(this).prop('id');
RemoveFile(file_id);
});

In case you want to pass both href and id then do this:

   function RemoveFile(id,link)
     {   
           $.ajax({
                type:'post',
                url:'hrms/delete_emp_file.php',
                data:{fid: id, rmvfile: link},
                success:function(msg){
                       if (msg.length> 0) {
                                 alert(msg);
                                   } 
                           }
                    });
     }
    $(".doc").on('touchstart click',function() {
    var file_id = $(this).prop('id');
    var file_link = $(this).prop('href');
    RemoveFile(file_id,file_link);
    });

Prabhash Rawat · Accepted Answer · 2015-01-02 12:51:24Z

Here are my code for delete image that dynamically generated from loop as you mentioned

   <ul class="hoverbox">
   <?php
        for($k=0;$k<$cardslen;$k++)
        {
           echo '<li class="inlineclass" id="ss'.$imagenames[$k]->id.'">';
           echo '<div class="scrolllist"><div class="img-wrap" id="s'.$imagenames[$k]->id.'"><span class="close"  id="'.$imagenames[$k]->id.'">&times;</span>';
          echo '<img id="'.$imagenames[$k]->id.'" data-id="'.$imagenames[$k]->id.'~'.$folder.'" alt="'.$imagenames[$k]->title.'" class="imglarge" id="imgSmile<?php echo $k;?>" style="height: 120px;" src="../images/morfeoshow/'.$folder.'/thumbs/'.$imagenames[$k]->filename.'">';
       echo '</div>';
          echo '</li>';
        }
       ?>
     </ul>

Here is script code

   <script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script>
     <script type="text/javascript">//<![CDATA[ 
     $(window).load(function(){
     $('.img-wrap .close').on('click', function() {
     var id = $(this).closest('.img-wrap').find('.imglarge').data('id');
      //alert(id);
      var r = confirm("Do you want to remove this image!");
       if (r == true) {
      $.ajax({
       url : "yoururl",
       type: "POST",
      data :{imageid:id},
      success: function(data)
       {
      //alert(data);
     $('#ss'+data).hide();
        $('#sss'+data).hide();
      $('#'+data).hide();
       $('#s'+data).hide();
      //location.reload();
       },});
    } 

  });
   });//]]>  

   </script>

And on ajax file i have just code delete mysql query for delete a record and code for delete image from folder. In this code ajax will delete image and after successful ajax call hide the delete image and page is not refresh. I think this code will help you

user4264796 · Accepted Answer · 2015-02-20 05:16:48Z

I solved this by following code

 while($fet=mysql_fetch_assoc($sql1))
            { 

             $next=$fet['f_name'];
             $next1 = basename($next);
             $ef=$fet['f_id'];
             echo '<h4><a class="astext" href="'.$next.'" title="'.$next.'" target="_blank" download><p style="margin-left:1cm;">'.$next1.'</a>';
              echo '<img src="image/delete1.png" alt="delete" style="width:10px;height:10px" title="Remove" onclick="myFunction('.$fet['f_id'].');">';
            }


        function myFunction(fid)
     {   
      var  rmvfile=fid;
      if (confirm("Are you sure you want to Delete the file?") == true) {
      if(fid!='')
        {
         $.ajax({
         type:'post',
         url:'delete_adm_file.php',
         data:{rmvfile: rmvfile},
         success:function(msg){
         location.reload();
         }
         });
         } } }

Collectives™ on Stack Overflow

delete a record on click using ajax

4 Answers 4

6 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related