2015-10-16 100 views
0

我有一个MySQL数据库,我通过PHP访问。我开始通过开发和提炼我的PHP代码来使用准备好的SQL语句访问数据库。我发送POST请求来测试代码(通过Python)并获得预期的结果。PHP和AJAX不工作

但是,我无法通过JQuery的AJAX功能来做到这一点。我感觉好像我的代码可能有不完善之处,因为我以前从未将这两者与MySQL结合使用。请告诉我我哪里错了。

我的错误是当我运行我的代码时,JavaScript控制台或页面上没有输出。我知道我的提交函数甚至被调用的唯一方法是通过alert("called")声明的成功。

HTML和JQuery:

<html> 
<head> 
    <title>Login form</title> 
    <link rel="stylesheet" href="css/index.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
</head> 
<body> 
    <script type="text/javascript"> 
     function sub(form){ 
      alert("called"); 
      $form = $(form); 
      $input = $form.find("[name='searchword']"); 

      $.ajax({ 
       url: "php/searchOld.php", 
       dataType: "application/json", 
       type: "POST", 
       data: "searchword="+$input.val(), 
       error: function(xhr, status, error) { 
         var err = eval("(" + xhr.responseText + ")"); 
         alert(err.Message); 
       }, 
       success: function(){ 
        alert("transaction succeeded"); 
        var arr = $.map(obj, function(el){ 
         return el; 
        }); 
        printResults(arr); 

       } 
      }); 
     } 

     function printResults(arr){ 
      for(var title of arr){ 
       $pTag = $("<p></p>"); 
       $pTag.append("<b>"+title+"</b>"); 
       $("#titles").append($pTag); 
      } 
     } 

    </script> 

    <form id = "searchForm" method="POST" onsubmit = "sub(this)"> 
     Enter the searchword: <input type="text" name = "searchword"><br> 
     <input type="submit"> 
    </form> 

    <br><br> 

    <div id = "titles"> 

    </div> 



</body> 
</html> 

PHP:

<?php 
    include("connect.php"); 
    $search = "%".$_POST['searchword']."%"; 



    $query = mysqli_prepare($link,"SELECT Title FROM `right` WHERE Title LIKE ?"); 
    if(!$query){ 
     echo mysqli_error($link); 
    } 

    mysqli_stmt_bind_param($query, "s", $search); 

    $query->execute(); 
    $query->bind_result($title); 
    $data = array(); 
    while($query->fetch()){ 
     array_push($data, $title); 
    } 

    echo json_encode($data); 


?> 
+0

有jquery ajax代码错误以及php脚本也有错误。首先解决php文件。注释掉$ search =“%”。$ _ POST ['searchword']。“%”;'line'并且硬编码'$ search =“something”'然后直接运行php scrip并查看输出是什么。如果它显示json编码的标题数组,然后让我知道。 – TipuZaynSultan

回答

0

首先你需要返回false内部功能,像这样的:

function sub(form){ 
    ....... 
    ....... 
    return false; // to prevent normal default behavior of form(page refresh) 
} 

而且成功块功能需要内部从服务器端传递保持结果obj的参数如下所示:

success: function(obj){ 
        ^------------------ here 
    alert("transaction succeeded"); 
    var arr = $.map(obj, function(el){ 
       return el; 
     }); 
    printResults(arr); 
} 

或者干脆返回onsubmit inline像这样:

onsubmit="sub(this);return false;" 
+0

谢谢你的回答。我加了两个东西,但我仍然得到相同的结果。我试图在一个文本文件上测试AJAX,并且发生同样的事情 – ytpillai

+0

我会尝试一下,并且对于文本文件,我使用了错误的函数:P。菜鸟的错误,对不起 – ytpillai

+0

好,非常感谢,它的工作。现在我有一堆JavaScript错误需要处理,但至少我知道要修复什么 – ytpillai

0

这里是您的解决方案:

HTML

<form id = "searchForm" method="POST" onsubmit = "return sub(this)"> 
    Enter the searchword: <input type="text" name = "searchword"><br> 
    <input type="submit"> 
</form> 

JS

function sub(form) { 
    $form = $(form); 
    $input = $form.find("[name='searchword']"); 

    $.ajax({ 
     url: "php/searchOld.php", 
     dataType: "json", 
     type: "POST", 
     data: "searchword="+$input.val(), 
     error: function(xhr, status, error) { 
      console.log(status+'---'+error); 
     }, 
     success: function(msg) { 
      alert("transaction succeeded"); 
      var arr = $.map(msg, function(el) { 
       return el; 
      }); 
      printResults(arr); 

     } 
    }); 
    return false; 
} 

function printResults(arr) { 
    for(var title of arr) { 
     $pTag = $("<p></p>"); 
     $pTag.append("<b>"+title+"</b>"); 
     $("#titles").append($pTag); 
    } 
}