Item is not deleted dynamically using foreach

Navigation
0

I'm in a small deadlock, but not in my head right now. I have a list of items in which an exclude button for each item. These items are removed by passing the UUID parameter. If I set a value to UUID out of foreach , it is usually deleted, but when I create the items dynamically, I can not delete the selected item.

Form hardcore: 

<form id='form_delete_action' method='POST' action=''>
   <tr>
      <input type='hidden' name='function' value='delete_action'>
      <input type='hidden' name='uuid' value='182nagojvgaf'>
      <button name="delete_action" type="submit" class="btn btn-danger btn-xs">excluir</button>
   </tr>
</form>

Dynamic Form: (not working) 

foreach($json['actions'] as $item) {
echo "
<form role='form' id='form_delete_action' method='POST' action=''>
   <tr>
      <td><input type='checkbox' name='vehicle' value='car'></td>
      <input type='hidden' name='function' value='delete_action'>
      <input type='hidden' name='uuid' value='".$item['uuid']."'>
      <td>".$item['uuid']."</td>
      <td>".$item['created_at']."</td>
      <td>".$item['description']."</td>
      <td>".$item['category']."</td>
      <td>".$item['request_at']."</td>
      <td>".$item['value']."</td>
      <td>
         <button name='delete_action' type='submit' class='btn btn-danger btn-xs'>excluir</button>
      </td>
   </tr>
</form>
";
}

Maybe it's not very relative, but below is the jQuery I use for deletion: 

jQuery('#form_delete_action').submit(function(){
    var dados = jQuery( this ).serialize();

    jQuery.ajax({
        type: "POST",
        url: "core/functions.php",
        data: dados,
        success: function( data )
        {
            //alert($("#description").val() + " - "+ $("#category").val() + " - "+ $("#type").val() + " - "+ $("#value").val());
            location.reload();
        }
    });

    return false;
});

Inside core/functions.php is API calls to add, edit, and delete.

Does anyone have any idea what it can be?

    
asked by anonymous 16.01.2017 / 19:56

1 answer

1

It is not good practice to have multiple forms on one page.

I do not know if I can say if the dynamic way you've implemented is wrong, but I would not use this approach.

I would do so: 

echo "<form role='form' id='form_delete_action' method='POST' action=''>";
foreach($json['actions'] as $item) {
   echo "
   <tr>
      <td><input type='checkbox' name='vehicle' value='car'></td>
      <input type='hidden' name='function' value='delete_action'>
      <input type='hidden' name='uuid' class="idExcluir" value='".$item['uuid']."'>
      <td>".$item['uuid']."</td>
      <td>".$item['created_at']."</td>
      <td>".$item['description']."</td>
      <td>".$item['category']."</td>
      <td>".$item['request_at']."</td>
      <td>".$item['value']."</td>
      <td>
         <button name='delete_action' type='submit' class='btn btn-danger btn-xs btnExcluir'>excluir</button>
      </td>
   </tr>";
} //fim do foreach
ECHO "</form>";

Note that I added a class btnExcluir to the Delete button. And I also put a class idExcluir in input hidden which I assumed was a unique identifier of the element you want to exclude.

Now just treat the click inside the form, specifically the delete button: 

$("#form_delete_action").on("click", ".btnExcluir", function() {
   var idElementoExcluir = $(this).closest(".idExcluir").val();

   $.ajax({
        type: "POST",
        url: "core/functions.php",
        data: {idElementoExcluir: idElementoExcluir},
        success: function( data )
        {
            location.reload();
        }
    });

});

Of course you will need to adapt your php function to get the element ID to exclude per parameter. I'm not very good at php, I put the general idea here of what I would do to be able to solve your problem.

I still can not figure out why the form is empty. If you use the approach I suggested, neither need to form. Only from the table.

    
16.01.2017 / 20:58
Error creating mysql function [closed] Advanced SQL Query with dates