如何在WordPress中使用Ajax使用php和Json显示数据库列

debugcn 发表于 Dev

朱利安·大卫·阿莫雷吉·佛朗哥（Julian David Amortegui Franco）

我是ajax的新手，我有一个代码可以从wordpress中显示数据库列中的一些信息。我有以下PHP代码可与数据库连接并创建JSON文件：

<?php    
$username = $_REQUEST['username']; 
$password = $_REQUEST['password'];    

if (isset($username) && isset($password)) {
//CONEXION
    $host="localhost";
    $user="DB_Username";
    $pass="DB_Password";
    $dbname="DB_Name";

//Conexion
$conexion = mysqli_connect($host, $user, $pass,$dbname) 
or die("unexpected error");

//gWe made the search
$sql = "SELECT * FROM Column WHERE A_Login='$username'";
mysqli_set_charset($conexion, "utf8"); 

if(!$result = mysqli_query($conexion, $sql)) die();

$clients = array();

$num_result = mysqli_num_rows($result);

    if ($num_result == 0) {
        $clients = array("error" => "true", "msg" => "We can't found this user", "data" => $username);
    } else {
        while($row = mysqli_fetch_array($result)) 
        { 
            $id=$row['ID'];
            $Name=$row['Name'];

            if ($row['A_Login'] == $username && $row['A_Password'] == $password){        
                $clients[] = array('id'=> $id, 'Name'=> $Name);
                } else {
                    $clients[] = array('error'=> "true", "msg" => "Incorrect data");
                    }

        }
    }

$close = mysqli_close($conexion) 
or die("Unespected error with DB");
  }
else {
    $clients = array("error" => "true", "msg" => "You must fill all fields", "username" => $username);
}   
//We build the JSON
$json_string = json_encode($clients);
echo $json_string;

?>

在wordpress页面中，我有以下代码，我建立了一个表单，如果用户单击“提交”按钮，则会调用doLogin（）

<script type="text/javascript"> function doLogin(){
    data = {username: jQuery("#user").val(), password: jQuery("#pass").val()}
    console.log(data);
    jQuery.ajax({
    type: "POST",
    url: "Mywebsiteurl.php",
    data: data,
    beforeSend: function(){

    },
    success: function(data){
        console.log(data);
        //var arr = JSON.parse(data);
        //$('#forma').html(data);

    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        alert("Error");
        console.log(textStatus);
        console.log(errorThrown);
    }
});
} </script>

我需要在<div id="forma">列表中显示usign html，例如：

ID：VALUE ID名称：VALUE NAME

以及更多信息...

当我尝试在网站上打印所需的信息时，$('#forma').html(data);出现错误或只是空白。

我该如何解决？谢谢。

DpEN

在WordPress中，我们需要在此处将ajax钩子连接到您的check_user函数。

add_action('wp_ajax_your_action_from_js', 'your_function');

//Using ajax for non-logged users as well (PUBLIC)
add_action('wp_ajax_nopriv_your_action_from_js', 'your_function');

检查以下代码，了解有关您的上下文的操作方式。

在functions.php中

function check_user() {
    $username = $_REQUEST['username']; 
    $password = $_REQUEST['password'];    

    if (isset($username) && isset($password)) {
    //CONEXION
        $host="localhost";
        $user="DB_Username";
        $pass="DB_Password";
        $dbname="DB_Name";

    //Conexion
    $conexion = mysqli_connect($host, $user, $pass,$dbname) 
    or die("unexpected error");

    //gWe made the search
    $sql = "SELECT * FROM Column WHERE A_Login='$username'";
    mysqli_set_charset($conexion, "utf8"); 

    if(!$result = mysqli_query($conexion, $sql)) die();

    $clients = array();

    $num_result = mysqli_num_rows($result);

        if ($num_result == 0) {
            $clients = array("error" => "true", "msg" => "We can't found this user", "data" => $username);
        } else {
            while($row = mysqli_fetch_array($result)) 
            { 
                $id=$row['ID'];
                $Name=$row['Name'];

                if ($row['A_Login'] == $username && $row['A_Password'] == $password){        
                    $clients[] = array('id'=> $id, 'Name'=> $Name);
                    } else {
                        $clients[] = array('error'=> "true", "msg" => "Incorrect data");
                        }

            }
        }

    $close = mysqli_close($conexion) 
    or die("Unespected error with DB");
      }
    else {
        $clients = array("error" => "true", "msg" => "You must fill all fields", "username" => $username);
    }   
    //We build the JSON
    $json_string = json_encode($clients);
    echo $json_string;
}

add_action('wp_ajax_check_user', 'check_user');

//Using ajax for non-logged users as well (PUBLIC)
add_action('wp_ajax_nopriv_check_user', 'check_user');

在您的JS调用文件中。

在脚本中，该动作与您的_your_action_from_js相关。因此，需要采取行动来知道ajax必须在哪里击中。在我们的例子中，它执行我们的check_user并返回适当的值。

<script type="text/javascript"> 
function doLogin(){
    data = {action: 'check_user', username: jQuery("#user").val(), password: jQuery("#pass").val()}
    console.log(data);
    jQuery.ajax({
        type: "POST",
        url: ajax_url,
        data: data,
        beforeSend: function(){

    },
    success: function(data){
        console.log(data);
        //var arr = JSON.parse(data);
        //$('#forma').html(data);

    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        alert("Error");
        console.log(textStatus);
        console.log(errorThrown);
    }
});
} 
</script>

参考简单AJAX表单：http：//wptheming.com/2013/07/simple-ajax-example/

CODEX参考：https : //codex.wordpress.org/AJAX_in_Plugins

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。