ajax请求，查询数据库，json_encode，成功返回，显示结果 [英] ajax request, query database, json_encode, return on success, show results

问题描述

我正在开发一段新代码，而我对ajax还是陌生的，所以我无法使其正常工作.我有一个分配了javascript onKeyUp的文本框.第一个功能是延迟功能.它设置一个延迟计时器，并且只要没有通过该延迟计时器发出其他请求，它就会在一定时间段后使用ajax运行第二个功能.在ajax内部，它基于在文本框中输入的文本，运行位于第二个文件中的数据库查询.它设置一个结果数组，对它们进行json_encode编码，然后将它们返回到原始页面.然后，我需要用结果填充页面(使用php).

I'm working on a new piece of code and I'm new to ajax so I cant get it to work. I've got a textbox that has a javascript onKeyUp assigned to it. The first function is a delay function. It sets a delay timer, and as long as no other request is made via that delay timer, it runs a second function with the ajax after a certain time period. Inside the ajax, it runs a database query located in the second file based on the text that was entered in the textbox. It sets up an array of the results, json_encodes them, and returns them back to the original page. Then, I need to populate the page with the results (with php).

<input type="text" onKeyUp="delay_method('search_customer',search_customer(this.value),'2000')" />

延迟功能

<script type="text/javascript">
function delay_method(label,callback,time){
    if(typeof window.delayed_methods=="undefined"){window.delayed_methods={};}  
    delayed_methods[label]=Date.now();
    var t=delayed_methods[label];
    setTimeout(function(){ if(delayed_methods[label]!=t){return;}else{  callback();}}, time||500);
  }
</script>

ajax函数

<script type="text/javascript">

function search_customer(value){    

console.log(value); 

    $.ajax({
  type: "POST",
  url: "secondpage.php",
  data: query,
  dataType: 'json',
  success: function(data){
    console.log(data.name); // customer name
    console.log(data.company);   // customer company name
  }
});
}

</script>

第二页

设置一个数组进行测试.现在绕过查询.只需要将结果返回首页即可.一旦工作，我就可以从php设置数组.我的查询将使用LIKE %search text%

$arr = array(
  'name'=>'overflow',
  'company'=>'value'
);
echo json_encode($arr);

我不知道如何从ajax函数检索数据并填充结果.我希望将结果返回到php数组中，然后循环遍历该数组以回显结果.我可以遍历php中的数组... 我最大的担心是将结果返回到php数组中.

I have NO clue how to retrieve the data from the ajax function and populate the results. I would love to get the results back into a php array, and then loop through the array to echo out the results. I can loop through the array in php...my biggest concern is getting the results back into a php array.

任何帮助都会很棒.我似乎无法使代码正常工作.我是ajax的新手，所以我正在学习.

Any assistance would be great. I cant seem to get the code to work. I am new to ajax so I'm learning this as I go.

一切正常，除了延迟.它不会拖延任何事情.我需要它从每次键入等待2秒钟，然后才能激活ajax功能.如果收到另一个按键，它将再等待2秒钟. IT继续进行直到有2秒钟没有键盘输入.这样，如果该人仍在键入，则它不会在每个按键上都查询数据库.现在，它可以使用每个快捷键来处理所有内容.

Everything is working the way it should except the delay. Its not putting a delay on anything. I need it to wait for 2 seconds from each keyup before it activates the ajax function. If it receives another keyup, it waits an additional 2 seconds. IT continues until there is 2 seconds with no keyups. That way its not querying the database on every single keyup if the person is still typing. Right now its processing everything with each keyup.

文本框

<input type="text" onKeyUp="delay_method('search_customer',search_customer(this.value),'2000')" />

延迟

function delay_method(label,callback,time){
    if(typeof window.delayed_methods=="undefined"){window.delayed_methods={};}  
    delayed_methods[label]=Date.now();
    var t=delayed_methods[label];
    setTimeout(function(){ if(delayed_methods[label]!=t){return;}else{  callback();}}, time||500);
  }

ajax功能

function search_customer(value){    

console.log(value); 

    $.ajax({
  type: "POST",
  url: "secondpage.php",
  data: { "value": value },
  dataType: 'html',
  success: function(data){
      $('#resultDiv').html(data);
  }
});
}

第二页:

$value = $_POST['value'];

if ((isset($value)) && ($value != "")) { 
$arr = array();
$search_query = $db1q->query("SELECT first_name, company FROM Users WHERE first_name LIKE '%$value%' OR last_name LIKE '%$value%' OR company LIKE '%$value%'");
if ($search_query->num_rows > 0) {

    while ($search_result = $search_query->fetch_assoc()) {
$arr[$search_result['first_name']] = $search_result['company'];
    }
}

   $html = '';
    $html .= '<div>';
    foreach ($arr as $key => $value) {
        $html .= '<div class="sub-div"><h2>'.$key.'</h2> : ' . '<h4>' . $value . '</h4></div>';
    }
    $html .= '</div>';

echo $html;
}

推荐答案

您无法将结果返回到js中的php数组中.因此，您要做的是在js中传递经过处理的html，然后仅在页面上打印.

You can't get the results back into a php array in js. So, what you have to do is to pass processed html in js and just print on page.

例如， 在第二页

$arr = array(
  'name'=>'overflow',
  'company'=>'value'
);

使用上面的数组$ arr在此处制作html并将其存储在变量中.将该变量传递给js.

using above array $arr make html over here and store it in variable. pass that variable into js.

对于Ex:

    $html = '';
    $html .= '<div>';
    foreach ($arr as $key => $value) {
        $html .= '<div class="sub-div"><h2>'.$key.'</h2> : ' . '<h4>' . $value . '</h4></div>';
    }
    $html .= '</div>';

echo $html;

现在，您将在ajax成功中获得html.就像在div上显示一样

Now you will get html in your ajax success. just show on div like

$('resultDiv').html(data);

这篇关于ajax请求，查询数据库，json_encode，成功返回，显示结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！