Page 2 of 3

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:39 am
by simonmlewis
Nothing is being sent. Originally it worked with my "bad" code sending over "all" as one value in that select. But now that is not changing.
I can see the keyup, so how do I add to that function, an onchange to the select field as well?

I get it though... because if I then change the select field to something else, and then change the text field, it does operate. But not if I enter "white" in the text field (that shows White on screen), and then change the dropdown... which does nothing.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:41 am
by simonmlewis
I did just try this, but that breaks it all.

Code: Select all

// This really belongs in a separate JS file, not embedded alongside PHP or HTML
$(document).ready(function() {
    $('.home-search-input input').on('keyup', function(event) {
        var search_string = $(this).val();

        // Don't fire on very short strings
        if (search_string.length > 2) {
        $('.home-search-cat select').on('change', function(event) {
            var category = $('.home-search-cat select').val();
            }
            $.ajax({
                url: '/ajax-search.php?search=' + search_string + '&category=' + category,
                method: 'GET'
            }).done(function(response) {
                $('#txtHint').html(response);
            });
        }
    });
});

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:45 am
by Celauran
simonmlewis wrote:I did just try this, but that breaks it all.
That's not a terribly helpful comment, now is it?

What's working? What isn't?

Alternately, just append '&category=some_value' to your original code and leave it at that. Leave the cleanup for another day.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:47 am
by simonmlewis
Ok.
Without my change, it processes the search value. That works. But the category value isn't changed. Nothing is passed over.
If I change it to what I have shown you, nothing is passed over at all, and the script does not run to completion.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:56 am
by Celauran
simonmlewis wrote:Without my change, it processes the search value.
What change, specifically?
simonmlewis wrote:But the category value isn't changed. Nothing is passed over.
As in the AJAX request doesn't fire? It fires but category is always empty?

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:57 am
by Celauran
https://jsfiddle.net/s7n2ujLq/

I had to remove the AJAX call for obvious reasons, but values are updating as expected. What's different on your end?

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 9:59 am
by simonmlewis
Yes I Assume this change would help:

Code: Select all

         $('.home-search-input input').on('change', function(event) {
            var category = $('.home-search-cat select').val();
            }
So it would then fire the value into category on that change too.

With your fiddle, it process it if i type something in, but if I change the dropdown, it does nothing... unless after changing the dropdown I change the text again.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:01 am
by Celauran
simonmlewis wrote:With your fiddle, it process it if i type something in, but if I change the dropdown, it does nothing... unless after changing the dropdown I change the text again.
Right. I already specifically mentioned that I had only attached a listener to the search input. Once that's working, it's pretty trivial to attach one to the select as well.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:02 am
by simonmlewis
Haha.. yes it's probably trivial for you, but I have tried it with a tiny amount of my own logic and it didn't work.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:02 am
by Celauran

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:03 am
by Celauran
simonmlewis wrote:Haha.. yes it's probably trivial for you, but I have tried it with a tiny amount of my own logic and it didn't work.
That's fine. Let's get one thing working properly and then build on that.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:13 am
by simonmlewis
Ok... i'm now not sure it's sending it over.
I failed to spot that you had the html(" words here ") in your code.

Code: Select all

<script>
// This really belongs in a separate JS file, not embedded alongside PHP or HTML
$(document).ready(function() {
$('.home-search-input input').on('keyup', function(event) {
  var search_string = $(this).val();

  // Don't fire on very short strings
  if (search_string.length > 2) {
    var category = $('.home-search-cat select').val();
    $('#txtHint').html(response);
  }
});

$('.home-search-cat select').change(function(event) {
	var category = $(this).val();
  var search_string = $('.home-search-input input').val();
  
    $('#txtHint').html(response);
});
});
</script>			
Changed it to this, but it's not putting the response into the DIV.

Here is the top bit of the PHP db file.

Code: Select all

<?php
session_start();
$todaydate = date('Y-m-d');
$newdate = strtotime("$todaydate");

if(isset($_GET['search']))
{
    $search = $_GET['search'];
    $search = str_replace("-", " ", $search);
    $_SESSION['search']=$search;
} elseif (isset($_SESSION['search'])) {
    $search=$_SESSION['search'];
}

if(isset($_GET['category']))
{
    $category = $_GET['category'];
    $category = str_replace("-", " ", $category);
    $_SESSION['category']=$category;
} elseif (isset($_SESSION['category'])) {
    $category=$_SESSION['category'];
}

if (isset($search) && $search <> '')
{
include "dbconn.php";

echo "<div class='ajax_toggle'><div class='ajax_toggleresults'>results $search $category</div><div class='ajax_togglebtn'><a href=\"javascript:toggleDiv('srcHint');\">Close</a></div><div style='clear: both' /></div></div>";

if ($category == "all")
{
$query = "SELECT * FROM products WHERE (title LIKE :search OR romancode LIKE :search OR metakeywords LIKE :search OR MATCH(title) AGAINST (:search)) AND pause <> 'on'";
}
else
{
echo "$category";
$query = "SELECT * FROM products WHERE (title LIKE :search OR romancode LIKE :search OR metakeywords LIKE :search OR MATCH(title) AGAINST (:search)) AND pause <> 'on' AND catname =:category";
}
$result = $pdo->prepare($query);
$result->execute(array(':search' => "%{$search}%", ':category' => $category));

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:14 am
by simonmlewis
Oh i can see why, it's not going out to ajax-search.php to run any queries.........................

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:23 am
by Celauran
Yeah. The $.ajax call is required to actually send the request. I can't do that on jsfiddle because I have nowhere to send it.

Re: How do you submit more than one variable via Ajax?

Posted: Wed Jun 29, 2016 10:24 am
by simonmlewis
Sure. But what is the "line of code" I had to pop in, and where.... so I can see if it works this end?