使用.val（''）重置字段后，表单字段为空，直到页面重新加载

在我的文档中，我使用Bootstrap Modal动态加载文档。在这个模式窗口中，我使用ajax将两个表单域的值添加到数据库中。在成功请求之后，我重置了使用.val（''）提交的两个表单。这工作正常，但是当我关闭模式窗口并再次打开时，每次表单域都是空的。只有当我重新加载页面并打开Modal时，一切正常。使用.val（''）重置字段后，表单字段为空，直到页面重新加载

错误在哪里？直到我重新加载页面为止，这两个表单字段的重置将用于整个会话。

这里是我的Ajax代码：

 $(document).on('click', 'form.form-inline button', function(e) { 

     e.preventDefault ? e.preventDefault() : e.returnValue = false; 

     var pMacaddr = $('#macaddr').val(); 
     var pHostname = $('#hostname').val(); 

     var that = $(this); 

     $.ajax({ 
      async: true, 
      type: 'POST', 
      url: propertie.backend+'?action=ajax&method=addmac&lang='+propertie.language+'&code='+Math.random(), 
      dataType: 'json', 
      data: { 
       'hostname': pHostname, 
       'macaddr': pMacaddr, 
      },error: function(data) { 
       alert('PHP-Error: '+data['responseText']); 
      },success: function(data) { 
       if (data.success === false) { 
        alert(data.message); 
       } else { 

        var html = "<tr id=\""+pId+"\">\n"; 
         html += "\t<td>"+pMacaddr+"</td>\n"; 
         html += "\t<td>"+pHostname+"</td>\n"; 
         html += "\t<td><a href=\"javascript:void(0);\" title=\""+propertie.l10n.delete+"\">"; 
         html += "<i class=\"fa fa-close fa-fw\"></i></a><a href=\"javascript:void(0);\""; 
         html += " title=\""+propertie.l10n.edit+"\"><i class=\"fa fa-pencil fa-fw\"></i></a></td>\n</tr>\n"; 

         $(that).closest("tr").before(html); 

         $('#macaddr').val(''); 
         $('#hostname').val(''); 

       } 
      },cache: false, 
     }); 

    });

要打开莫代尔我用这个代码：

 $(document).on('click', '[data-toggle="ajaxModal"]', function(e) { 
     $('#ajaxModal').removeData('bs.modal'); 
     e.preventDefault ? e.preventDefault() : e.returnValue = false; 
     var $this = $(this) 
     , $remote = $this.data('remote') || $this.attr('href') 
     , $modal = $('<div class="modal fade" id="ajaxModal"><div class="modal-dialog"><div class="modal-content"></div></div></div>'); 
     $('body').append($modal); 
     $modal.modal({remote: $remote}); 
     $modal.modal('show'); 
    });

来源

2016-11-11 erselbst

我发现我错了。 Modal元素只是隐藏的，不能从文档中移除。我修改了我的Open-Modal功能，现在当关闭Modal时，Modal窗口将从文档中删除。

 // open modal 
    $(document).on('click', '[data-toggle="ajaxModal"]', function(e) { 

     e.preventDefault ? e.preventDefault() : e.returnValue = false; 

     var $this = $(this) 
     , $id = $this.data('id') || 'ajaxModal' 
     , $remote = $this.data('remote') || $this.attr('href') 
     , $modal = $('<div class="modal fade" id="'+$id+'" role="dialog"><div class="modal-dialog"><div class="modal-content"></div></div></div>'); 

     $('body').append($modal); 
     $modal.modal({remote: $remote, keyboard: false, backdrop: false}); 
     $modal.modal('show'); 

     // On hidden event, remove the current modal from document 
     $(document).on('hidden.bs.modal', '#'+$id, function(e) { 
      $(this).remove(); 
     }); 

    });

现在表单字段与val（）一起使用。

来源

2016-11-14 16:59:39 erselbst

使用.val（''）重置字段后，表单字段为空，直到页面重新加载

回答

相关问题