不工作阿贾克斯阿贾克斯后，从里面的div

Question

我是一个客户管理系统和IM目前停留在一个问题我一直在试图找出了一个星期的工作得到，现在已江郎才尽

我有index.php基本上它是一个简单的形式，你提交一个客户的名字和姓氏然后阿贾克斯发送请求functions2.php添加到数据库，然后报告成功与否，然后webapp_get_customers检索并更新与新客户的表到webapp_get_customers DIV而无需刷新页面，这是在get.php页面上可以正常使用

然而

我有一个从表中选择结果的表，然后在下面添加到b相同的形式e能够编辑客户名称时，我在索引页上编辑其打开窗体中正确的模式，但不是不提交表单，因为它不能找到ajax

所以我追求的是我怎样才能得到它查看webapp_get_customers div来查看表单是否被提交，或者我是否会做出这种错误。即时通讯思想浏览器无法看到驻留在get.php页面上的DIV里面的代码它只是返回加载的内容

请帮助其非常apreciated

<form name='frm_details' class='frm_details' id='frm_details0' action=''> 
<input type='text' class='form-control' name='cu_fname' required> 
<input type='text' class='form-control' name='cu_lname' required> 
<input type='submit' value='Save' > 
</form> 

    <script> 
     $(function() { 
      $('form.frm_details').on('submit', function(event) { 
       event.preventDefault(); 
       $.ajax({ 
        url: '/limitless/functions2.php', 
        type: 'post', 
        dataType: 'json',      
        data: $(this).serialize(), 
         success: function(data) { 
          if(data.status == '1') 
          { 
           $('#info').addClass('alert alert-danger no-border').html(data.message); 
          } 
          if(data.status == '2') 
          { 
           $('#info').addClass('alert alert-danger no-border').html(data.message); 
          }        
         } 
       }); 
      }); 
     }); 
    </script> 

    <script> 
    function webapp_get_customers(){ 
     $.ajax({ 
     type: 'GET', 
     url: '/limitless/get.php', 
     dataType: 'html' 
     }).done(function(data) { 
     $('#webapp_get_customers').html(data); 
     }); 
    } 
    webapp_get_customers(); 
    </script>  


    <div id='webapp_get_customers'></div> 

Answer 1

我建议ü使用ajaxSubmit会提交一个表单，它会为你处理表单域的序列化。

$("#yourFormSelector").ajaxSubmit({ 
    type: "POST", 
    url: url, 
    beforeSend: function (msg) { 
     //Do something before sending your request 
    }, 
    success: function (data, status, xhr) { 
     //Do something on success 
    }, 
    error: function (xhr, status, error) { 
     //Do something on success 
    }, 
    complete: function (event, xhr, option) { 
     //Do something on complete (whether it was successful or not) 
    } 
}); 

Answer 2

首先，如果你想检查提交过程，你可以在Chrome（或Firefox）中打开开发工具，点击网络面板。显示在那里的所有请求。其次，如果在加载页面后添加表单（或其他DOM），则事件侦听器将不会正确添加到它。您需要再次手动绑定它。

Answer 3

你只需要从功能删除发送jQuery的AJAX功能，并调用它以这样的方式

<form name='frm_details' class='frm_details' id='frm_details0' action=''> 
    <input type='text' class='form-control' name='cu_fname' required> 
    <input type='text' class='form-control' name='cu_lname' required> 
    <input type='submit' value='Save' > 
    </form> 

     <script> 
      $(function() { 
       $('form.frm_details').on('submit', function(event) { 
        event.preventDefault(); 
        $.ajax({ 
         url: '/limitless/functions2.php', 
         type: 'post', 
         dataType: 'json',      
         data: $(this).serialize(), 
          success: function(data) { 
           if(data.status == '1') 
           { 
            $('#info').addClass('alert alert-danger no-border').html(data.message); 
           } 
           if(data.status == '2') 
           { 
            $('#info').addClass('alert alert-danger no-border').html(data.message); 
           }        
          } 
        }); 
       }); 
       $.ajax({ 
        type: 'GET', 
        url: '/limitless/get.php', 
        dataType: 'html', 
        success: function(data) 
        { 
        //alert(html); 
        $('#webapp_get_customers').html(data); 
        } 
       }); 

      }); 
     </script>  

     <div id='webapp_get_customers'></div>