2015-08-18 148 views
0

我发送ajax请求到一个单击按钮的php页面。这里是我的请求被发送ajax请求无效?

$("#enteruser").on('click',function(){ 
console.log("entered here"); 
var name=$("#ename").val(); 
var email=$("#eemail").val(); 
var role=$("#erole").val(); 

var data={name: name, email:email, role:role}; 
var url='addemployee.php'; 

$.ajax({ 
    url : url, 
    data: data, 
    type: 'POST', 
    success: function(response) 
    { 
     if(response=="success") 
      { 
      $("#rmsg").text("Hello World"); 
      } 
     else 
      { 

      } 

    } 
}); 

}); 

我此行不工作,返回回后URL中包含我发送的值。所以如果我重新发送请求,请求不会再次由于url发送。如果我把下面的行

window.location="anotherpage.html"; in the success block the page is redirected to the that page. Then why the rmsg paragraph is not being written? 

我加入的形式动态地使用下面的代码

$("#create").on('click',function(){ 
var htmc='<div class="testbox">\n\ 
    <h1>Create Employee</h1>\n\ 
     <form>\n\ 
      <hr>\n\ 
     <label id="icon" for="eemail"><i class="icon-envelope "></i></label>\n\ 
     <input type="text" name="eemail" id="eemail" placeholder="Email" required/>\n\ 
     <label id="icon" for="ename"><i class="icon-user"></i></label>\n\ 
     <input type="text" name="ename" id="ename" placeholder="Name" required/>\n\ 
     <label id="icon" for="erole"><i class="icon-road"></i></label>\n\ 
     <input type="text" name="erole" id="erole" placeholder="Role" required/>\n\ 
     <button id="enteruser" class="button">Enter</button>\n\ 
     </form>\n\ 
    </div>'; 
$("#view").html(htmc); 
}); 

$(document).on("#enteruser",'click',function(e){ 
    e.preventDefault(); 
    console.log("entered here"); 
var name=$("#ename").val(); 
var email=$("#eemail").val(); 
var role=$("#erole").val(); 

var data={name: name, email:email, role:role}; 
var url='addemployee.php'; 

$.ajax({ 
    url : url, 
    data: data, 
    type: 'POST', 
    success: function(response) 
    { 
     if(response=="success") 
      { 

      alert(response); 
      $("#rmsg").text("Hello World"); 
      } 
     else 
      { 

      } 

    } 
}); 

}); 
+0

如果(响应= =“成功”)你确定PHP脚本回声字符串“成功”?我看到ajax调用本身没有问题,只是提示(响应) – volkinc

+0

尝试先使用调试器来查看您的请求是否经过。我只使用Chrome,其中F12将调出调试器。打开并选择网络选项卡并按下按钮以触发您的请求。查看结果(如果它调用addemployee.php),请单击它并查看标题以查看该数据是否添加到标题中。也看看你得到的回应。 – DTH

+0

请发布您的php –

回答

0

有一件事我喜欢当排查HTTP调用处于调试查看实际的网络事件做工具。

在谷歌浏览器中,使用CTRL + SHIFT + I打开调试工具。然后点击Network标签。在这里,您可以查看POST和Response并验证您的回复是否正确。

在微软IE浏览器,你可以按下F12键来查看开发工具有

0

你不会阻止默认行为的一种形式。你应该对你的应用说:“对表单不做任何事情,并且让它由js来处理”。 此外,您正以错误的方式使用委托功能。

这样做更改此:

$("#enteruser").on('click',function(){ 
console.log("entered here"); 

这样:

$("#enteruser").click(function(e){ 
e.preventDefault(); 
console.log("entered here"); 

所有代码的另一部分可以保持和现在一样,如果形式是从一开始就DOM。

$(document).on('click',"#enteruser",function(e){ 
e.preventDefault(); 
console.log("entered here"); 

如果表单在加载后被添加到页面中。还可以与任何元件替换文件已经在那就是在DOM结构的形式之前的页面

+0

它也不能解决问题 –

+0

在这种情况下你会得到什么?你有什么错误吗? –

+0

没有错误。甚至没有显示控制台消息。 –

0

尝试此

<html> 
    <head> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 

    </head> 

    <body> 

    <input type="text" id="ename" /> 
    <input type="text" id="eemail" /> 
    <input type="text" id="erole" /> 
    <span id="rmsg"></span> 

    <button id="enteruser">Button</button> 

    <script type="text/javascript"> 

    $("#enteruser").on('click',function(){ 

    console.log("entered here"); 
    var name=$("#ename").val(); 
    var email=$("#eemail").val(); 
    var role=$("#erole").val(); 

    var data={name: name, email:email, role:role}; 
    var url='addemployee.php'; 

    $.ajax({ 
     url : url, 
     data: data, 
     type: 'POST', 
     success: function(response) 
     { 
      if(response=="success") 
       { 
       $("#rmsg").text("Hello World"); 
       } 
      else 
       { 

       } 

     } 
    }); 
    }); 


    </script> 

    </body> 
    </html> 

PHP:

<?php session_start(); echo 'success'; ?> 
+0

除了我的代码,这里有什么区别吗 –

+0

@编程爱好者你必须找出差异,因为你只发布了ajax部分,我发布了所有工作代码,以便你能找到差异 –

+0

额外的东西也在我的代码中,所以它应该和我有相同的问题 –