Item is not deleted dynamically using foreach

Asked

Viewed 67 times

0

I am in a small solvable impasse but not in my head at the moment. I have a list of items in which an delete button for each item. These items are removed by passing as parameter the UUID. If you set a value for the UUID outside the foreach, it is deleted normally, but when creating the items dynamically, I cannot delete the selected item.

Hardcore form: (works)

<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: (doesn’t work)

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 not very relative, but below follows the jQuery in which use for exclusion:

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;
});

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

Does anyone have any idea what it might be?

php form

  • And delete each? or have some javascript there?

  • @Miguel And that 1%? maybe yes, maybe no. I’m going to do a test!

  • you have a foreach forms, not a good practice. But it turns out that in addition to using the same name in all inputs uuid, you also use the same <form role='form' id='form_delete_action' method='POST' action=''> on all forms

  • @Leonardorodrigues all right, I’ve taken the form, but the impasse continues.

  • Well, if @Miguel’s suggestion didn’t work, try to change the names of inputs, assign names different for the forms. My suggestion would be to create a Key for each item, where you would use name, both in the forms and in the inputs

  • How you do to remove the item is direct with php or has some javascript?

  • @rray I use jquery to delete without leaving the page. ^^

  • If you use jQuery, when submitting a form it must present different identifications. So all forms must have name, and preferably a id own.

  • If you take the id of the button or input with jquery, see that a value will not be returned but a collection, at the time of deleting you need to indicate who triggered the event (from the click I imagine)

  • @rray note that using uuid hardcore excludes normally, considering using the same form name.

  • I think code is missing in the question ... put the jquery q you use.

  • 1

    You own a trigger type='submit' within your code, so each form is submitted by clicking on it, and you can take this event, having the exact form in question, through the function .submit(): https://api.jquery.com/submit/. Anyway, you should post the function jQuery you are using

  • @Leonardorodrigues added jquery, but I don’t think it’s so relative.

  • 1

    please test after function serialize();, try console.log(dados ); and post in question also.

  • @Marcelobonifazio the log doesn’t work, because when I use Ubmit, the page is being updated, this way, can not see anything in the log. Our

  • Add event.preventDefault(); inside the jquery function to prevent it from being updated, and try to get the log, when checking the log, check the fields uuid are correct with the forms in question

Show 11 more comments

1 answer

1

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

I don’t know if I can say if it’s wrong the way dynamics which you implemented, but me would not use that 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>";

Notice that I added a class btnExcluir on the Delete button. And I also put a class idExcluir in the input hidden that I assumed to be a unique identifier of the element you want to delete.

Now just treat the click inside the form, specifically on 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 receive the element ID to delete by parameter. I’m not very good in php, I put the general idea here of what I would do to solve your problem.

I still don’t understand why the form is empty. If you use the approach I suggested, you don’t even need a form. Table only.

Browser other questions tagged php form

You are not signed in. Login or sign up in order to post.