Ajax multiple textbox search request

Question

Hello Im trying to get my textboxes to work with a search option in the database via AJAX.

Im not getting it to work on multiple textboxes, only with one.

This is my code, maby you guys can help me getting it to work. That would be great.

php

<?php
$pdo = new PDO('mysql:host=localhost;dbname=records', 'root', 'l3tm31n');
$select = 'SELECT *';
$from = ' FROM overboekingen';

$opts = (isset($_POST['filterOpts']) ? $_POST['filterOpts'] : FALSE);
$val = (isset($_POST['text']) ? $_POST['text'] : FALSE);

if ($val != null){
  $where = " WHERE boekingsnummer LIKE '".$val."%'";
}
elseif ($val != null){
  $where = " AND huiscode LIKE '".$val."%'";
}
else {

  if (is_array($opts) || $val){
    $where = ' WHERE FALSE';
  else {
    $where = false;
  }

}

$sql = $select . $from . $where;
$statement = $pdo->prepare($sql);
$statement->execute();
$results = $statement->fetchAll(PDO::FETCH_ASSOC);
$json = json_encode($results);
echo($json);

html

<ul id="boekingsnummer" class="hide">                                
            <li><label>Boekingsnummer</label></li>
            <li><input type="text" name="boekingsnummer" size="20" id="boekingsnummer_1">
            <div class="suggestionsBox" id="suggestions2" style="display: none;">
            <div class="suggestionList" id="autoSuggestionsList2"></li>
</ul> 

<ul id="huiscode" class="hide">                                
            <li><label>huiscode</label></li>
            <li><input type="text" name="huiscode" size="20" id="huiscode_1" >
            <div class="suggestionsBox" id="suggestions5" style="display: none;">
            <div class="suggestionList" id="autoSuggestionsList5"></li>
</ul>

ajax

$('#boekingsnummer_1').keyup(function(){        
    updateEmployeesText($(this).val());        
});

$('#huiscode_1').keyup(function(){        
    updateEmployeesText($(this).val());        
});

function updateEmployeesText(val){        
    $.ajax({
    type: "POST",
    url: "submit.php",
    dataType : 'json',
    cache: false,
    data: {text: val},
    success: function(records){
        $('#employees tbody').html(makeTable(records));
    }        
}); 
}

@naota Sure I have updated the code with HTML and AJAX code that I use. The HTML stands for the 2 textboxes and the AJAX for the javascript part. — user3541335, May 26 '14 at 08:16
@naota Wel basically I dont get any eror, the 2e textbox is using the same sql statement from textbox 1. I cant seem to get them to work separately. — user3541335, May 26 '14 at 08:36

naota · Accepted Answer · 2014-05-26T10:40:54.697

0

EDIT:
I guess you might want to call the JavaScript function and PHP script like this: JavaScript

$('#boekingsnummer_1').keyup(function(){        
    updateEmployeesText($(this).val(),'boekingsnummer');        
});

$('#huiscode_1').keyup(function(){        
    updateEmployeesText($(this).val(),'huiscode');        
});

function updateEmployeesText(val,opt){        
    $.ajax({
    type: "POST",
    url: "submit.php",
    dataType : 'json',
    cache: false,
    data: {text: val, filterOpts:opt},
    success: function(records){
        $('#employees tbody').html(makeTable(records));
    }        
}); 
}

PHP:

$opts = (isset($_POST['filterOpts']) ? $_POST['filterOpts'] : FALSE);
$val = (isset($_POST['text']) ? $_POST['text'] : FALSE);

if (($val != FALSE) && ($opts == "boekingsnummer")){
  $where = " WHERE boekingsnummer LIKE '".$val."%'";
}elseif (($val != FALSE) && ($opts == "huiscode" )){
  $where = " WHERE huiscode LIKE '".$val."%'";
}

edited May 26 '14 at 10:40

answered May 26 '14 at 08:35

naota

4,695
1
18
21

Naota: right this seems to be the problem here, so that the second textfield will not be applied – Gizzmo May 26 '14 at 08:42
@user3541335: try to add in your ajax code the type (booking or huiscode) and than depending on this type buld your sql-query – Gizzmo May 26 '14 at 08:44
@Gizzmo and Naota, So I have to change the elseif construction to and 'IF' + 'AND' construction ? – user3541335 May 26 '14 at 08:56
@user3541335, it depends on what you would like to achieve with SQL. – naota May 26 '14 at 09:27
@naota Wel I want to get in each textbox another sql statement so differend results from mysql. Each textbox should get its own results from the database when you type something in it :) – user3541335 May 26 '14 at 09:50
@naota Thank you so much, this fixed the issue for me :) You have been a great help. Would this als work for a calendar input ? So actually a date input like '30-05-2014' ? – user3541335 May 26 '14 at 10:31
@naota Uhm I tryed your advise but it seems its not working. When I enter the date it will not filter. Any ideas ? – user3541335 May 27 '14 at 12:57
@user3541335, OK. Since this page is long enough, could you make another question about it and let me know? I will post an answer for it. – naota May 27 '14 at 13:02
Sure thing I made another tread on the following page: http://stackoverflow.com/questions/23891394/textbox-is-not-working-for-date-input – user3541335 May 27 '14 at 13:54

Ajax multiple textbox search request

1 Answers1