Explore our sites

Stack Exchange
tour help careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I'm coding form where a user can submit playlists. There is an 'artist' field and a 'song' field. Both are input type 'text'.

I'm attempting to use jquery's autocomplete functionality in both fields. Autocomplete results for the artist are functions of user-keystrokes and autocomplete results for songs are functions of user-keystrokes AND the value of the artist input field.

Autocomplete seems to work to populate a list of suggestions under the artist input field. search.php is the script reading the query string.

$(".artist").autocomplete("searchDev.php?type=artist&"+mydate.getTime(), {
    width: 180,
    selectFirst: false
});

In search.php, a var_export of $_GET in searchDev.php after an a keystroke yields

array (
  'type' => 'artist',
  1367531572213 => '',
  'q' => 'a',
  'limit' => '10',
 'timestamp' => '1367531576911',
)

This is just fine. However, when I try to supply a variable to the query string(here window.sartist) in autocomplete(for the song input field), 

    $(".song").autocomplete("search.php?type=song&sartist="+window.sartist+"&"+mydate.getTime(),      {
    width: 180, 
    selectFirst: false
});

sartist is not defined correctly, ie var_export($_GET) in search.php yields

array (
  'type' => 'song',
  'sartist' => '[object HTMLInputElement]',
  1367525807081 => '',
  'q' => 'a',
  'limit' => '10',
  'timestamp' => '1367526169637',
)

if a global variable, not attached to the window is used in place of window.sartist in the query string, var_export($_GET) yields

array (
  'type' => 'song',
  'sartist' => '',
  1367528252501 => '',
  'q' => 'a',
  'limit' => '10',
  'timestamp' => '1367528260585',
)

So I suspect that the query string cannot be modified after it is loaded. Does anyone have a viable workaround to allow variables to be dynamically assigned to the autocomplete query string? Basically I need the 'song' autocomplete suggestions contingent upon the value of the 'artist' field.

share|improve this question
 
Where is sartist definition? What is its value? –  ghost May 2 '13 at 22:38
add comment

1 Answer

up vote 1 down vote accepted

You just need to use a function as source to pass multiple dynamics params to the query :

$('.song').autocomplete({
   var value = $(this).val(); 
    source:function( request, response ) {
          $.getJSON( "searchDev.php", {
            term: value ,
              data:{
                  type:"song",
                  myparam:$('#myparam').val()
              }
          }, response );
   }
})

In this example, if current input .song have value 'high hope' and the #myparam field have value "pink" the query will looks like : searchDev.php?term=high+hope&type=song&myparam=pink

Fiddle (no real data source, just see the console) : http://jsfiddle.net/RfuBP/3/ Doc for the source option of jquery autocomplete : http://api.jqueryui.com/autocomplete/#option-source

PS : In your code, are you sure that window.sartist returns a value and not the element ?

share|improve this answer
 
Terrific Thank you! window.sartist was indeed returning the value and not the element, so still a little perplexed there –  rocketas May 3 '13 at 17:20
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.