Question

I’m using an autosuggest plugin that allows me to select multiple items from a dropdown menu (demo here). I want a query to be sent to a php file (I will be preoccupied with the query itself later) and get a result back without leaving the page.

The php file is pretty much empty right now:

<?php print_r($_REQUEST); ?>

But I know I made a mistake with my jquery somewhere since the search box is not displaying properly anymore.

Here’s the code I built up, I’m not sure what to put in the “data” field.

 <script type="text/javascript">
            $(document).ready(function(){                
                $("#select3").fcbkcomplete({
                    json_url: "data.txt",
                    addontab: true,                   
                    maxitems: 10,
                    input_min_size: 0,
                    height: 10,
                    cache: true,
                    newel: false,
                    filter_selected: true,
                    maxitimes: 5,


                    // I did this
                    onselect:"get_venue",




                });


    // I also did this

    function get_venue() {
    $("#select3 option:selected").each(function() {
$.ajax({
        type: 'POST',
        url: 'post.php',
        dataType: 'json',
        data: {
            WHAT DATA GOES HERE?
        },
success : function(data){
                $('#phpmessage').removeClass().addClass((data.error === true) ? 'error' : 'success')
                    .text(data.msg).show(500);
                if (data.error === true)

            },
            error : function(XMLHttpRequest, textStatus, errorThrown) {
                $('#waiting').hide(500);
                $('#phpmessage').removeClass().addClass('error')
                    .text('There was an error.').show(500);
            }
        });       
    });
}





            });
        </script>

Sorry for such a long post everybody :)!! Thanks :))

Error I’m getting:

Is not a function: return func.call(func, _object);

function funCall(func, item) {
var _object = {};
for (i = 0; i < item.get(0).attributes.length; i++) {
if (item.get(0).attributes[i].nodeValue != null) {
_object["_" + item.get(0).attributes[i].nodeName] = item.get(0).attributes[i].nodeValue;
}
}
return func.call(func, _object);
}
function checkFocusOn() {
if (focuson == null || focuson.length == 0) {
return false;
}
return true;
} 

Answer 1

You want to loop over each of the items in the search box, these have a class of .bit-box. Create an array of these search terms then send them in as data into the ajax request.

function get_venue() {
var data = []; 
$('.bit-box').each(function() {
    data.push( $(this).text );     
}); 

$.ajax({
        type: 'POST',
        url: 'post.php',
        dataType: 'json',
        data: {
            'choices[]': data
        },
    success : function(data){
              $('#phpmessage')
               .removeClass()
               .addClass((data.error === true) ? 'error' : 'success')
               .text(data.msg).show(500);
            if (data.error === true){ 
            }
        },
        error : function(XMLHttpRequest, textStatus, errorThrown) {
            $('#waiting').hide(500);
            $('#phpmessage').removeClass().addClass('error')
                .text('There was an error.').show(500);
        }
});       
}