Javascript 从表单中删除行而不更新表单

我使用异步请求根据数据库删除表单的行。 问题是，每当我删除行时，如果我对表单做了任何更改，我就会丢失所有更改，因为我将请求返回到数据库

因此，我打算删除这些行，而不必向数据库发出请求

代码：

成功：函数（数据1）{
var linha1=`；
对于（var i=0；i

JS:

$（文档）。在（“单击“，”。删除产品”，函数（）{
var-eliprod=[]；
$（“input[name='eliprod[]']”）each（function（）{eliprod.push（this.checked）}）；
var Id=[]；
$（“input[name='Id[]']）。每个（function（）{Id.push（this.value）}）；
var dadosajax={
“eliprod[]”：eliprod，
“Id[]”：Id
};
如果（确认（'Tem certeza de que deseja remover o produto do orçamento？'））
{
$.ajax({
url:'delorc.php'，
键入：“GET”，
cache:false，
资料来源：dadosajax，
错误：函数（）{
警报（'Algo estáerrado！'）；
},
成功：功能（数据）{
var orc=$（“输入[name='orc']”）val（）；
$.getJSON（'updorc2.php？orc'+'&orc='+orc，函数（data1）{
var linha2=`；
对于（var i=0；i

---

所以它是有效的，但是它有更新表单的问题。我想根据数据库删除表单输入，而不更新表单。首先，您需要将每行数据包装在一个div元素中，这将是父元素。让我们调用这个div，

这将在删除时确认您要删除的内容。然后它获取父元素

由于我们只删除选定的ID，因此只需获取并传递该ID。如果成功，我们只需从DOM中删除

\u parent

元素

通过执行此操作，表单不会发生更改，但删除的行除外

$(document).on("click", ".delete_prod", function() {
      if (confirm('Tem certeza de que deseja remover o produto do orçamento?')) {
      _parent = $(this).parents(".item-row");
    var dadosajax = {
      "Id[]" : _parent.find("input[name='Id[]']").val(),
    };

        $.ajax({
            url: 'delorc.php',
            type: 'GET',
            cache: false,
            data: dadosajax,
            error: function() {
              alert('Algo está errado!');
            },
            success: function(data) {
               _parent.remove();
            })          
        });
       }
});

---

我解决了我的问题如下：

var checados = [];
  $.each($("input[name='eliprod[]']:checked"), function(){            
    checados.push($(this).val());
  });

首先，我创建了一个父div，如下所示，其中包含我要消除的输入：

<div id="produto-${ Id }">

...

</div>

在成功中，我创建了一个循环以消除表单上的行，即使我选择了多个复选框，如下所示：

 for (var i = 0; i < checados.length; i++) { 
     Id = checados;
     $('#produto-' + Id[i]).remove();
 }

for（var i=0；i

完整代码：

 $(document).on("click", ".delete_prod", function(){

 var checados = [];
  $.each($("input[name='eliprod[]']:checked"), function(){            
      checados.push($(this).val());
  });

    var dadosajax = {
     'checados[]' : checados
    };

    if(confirm('Tem certeza de que deseja remover o produto do orçamento?'))
    {
        $.ajax({
           url: 'delorc.php',
           type: 'GET',
           cache: false,
           data: dadosajax,
           error: function() {
              alert('Algo está errado!');
           },
           success: function(data) {

             for (var i = 0; i < checados.length; i++) { 
                Id = checados;
    
                $('#produto-' + Id[i]).remove();
             }
                alert("Produto removido com sucesso");
                
           }
        });
    }

  }); 

$（文档）。在（“单击“，”。删除产品”，函数（）{
var checados=[]；
$.each（$（$输入[name='eliprod[]']：选中），函数（）{
checados.push（$（this.val（））；
});
var dadosajax={
“checados[]”：checados
};
如果（确认（'Tem certeza de que deseja remover o produto do orçamento？'））
{
$.ajax({
url:'delorc.php'，
键入：“GET”，
cache:false，
资料来源：dadosajax，
错误：函数（）{
警报（'Algo estáerrado！'）；
},
成功：功能（数据）{
对于（var i=0；i

dataajax中的Id变量得到这个值

16025415663

，而不是

Id

@Bruno，试着用原始输出的HTML而不是Ajax中生成的HTML更新问题。原始htm就是表单，因为我创建了动态生成的整个表单。如有必要，我可以填写完整的表格。

 for (var i = 0; i < checados.length; i++) { 
     Id = checados;
     $('#produto-' + Id[i]).remove();
 }

 $(document).on("click", ".delete_prod", function(){

 var checados = [];
  $.each($("input[name='eliprod[]']:checked"), function(){            
      checados.push($(this).val());
  });

    var dadosajax = {
     'checados[]' : checados
    };

    if(confirm('Tem certeza de que deseja remover o produto do orçamento?'))
    {
        $.ajax({
           url: 'delorc.php',
           type: 'GET',
           cache: false,
           data: dadosajax,
           error: function() {
              alert('Algo está errado!');
           },
           success: function(data) {

             for (var i = 0; i < checados.length; i++) { 
                Id = checados;
    
                $('#produto-' + Id[i]).remove();
             }
                alert("Produto removido com sucesso");
                
           }
        });
    }

  });