0

Hopefully this makes sense... but I am trying to write some initial ajax call to a test php page and i am getting an error within the console that reads:

Uncaught Error: Syntax error, unrecognized expression: {"projectId":"John","Project":"Some Project Name"} jquery-1.9.min.js:4
st.error jquery-1.9.min.js:4
ft jquery-1.9.min.js:4
wt jquery-1.9.min.js:4
st jquery-1.9.min.js:4
b.fn.extend.find jquery-1.9.min.js:4
b.fn.b.init jquery-1.9.min.js:3
b jquery-1.9.min.js:3
(anonymous function) download.js:27
c jquery-1.9.min.js:3
p.add jquery-1.9.min.js:3
(anonymous function) download.js:25
b.event.dispatch jquery-1.9.min.js:3
v.handle jquery-1.9.min.js:3

This is my jquery ajax call:

$.get('test.php', {object_ID: 'kjiyu-drtfg-hjuyt-hiytr'})
.done(function(data) {
    console.log(data);
    $(data).each(function(index, element) {
        $('#fileList').append('<option value="' + element.projectId + '">' + element.Project + '</option>');
    });
});

This is my test.php page:

<?php 
  echo json_encode(array(
              array("projectId"=>"John","Project"=>"Some Project Name"),
              array("projectId"=>"John2","Project"=>"Some Project Name 2")
            ));
?>

any advise would be greatly appreciated. In the end this will be hooked up to an actual page that looks up values from the database... I just want to get my first round going.

EDIT

I made the array change suggested but am now getting this error:

XMLHttpRequest cannot load file:///C:/Users/v-sthaff/Documents/School/Spring%202013/BIT%20286/Website/test.php?object_ID=kjiyu-drtfg-hjuyt-hiytr. Origin null is not allowed by Access-Control-Allow-Origin. jquery-1.9.min.js:5
send jquery-1.9.min.js:5
b.extend.ajax jquery-1.9.min.js:5
b.(anonymous function) jquery-1.9.min.js:5
(anonymous function) download.js:24
b.event.dispatch jquery-1.9.min.js:3
v.handle

XMLHttpRequest cannot load file:///C:/Users/v-sthaff/Documents/School/Spring%202013/BIT%20286/Website/test.php?projectId=abcde-abcde-abcde-abcde. Origin null is not allowed by Access-Control-Allow-Origin. jquery-1.9.min.js:5
send jquery-1.9.min.js:5
b.extend.ajax jquery-1.9.min.js:5
b.(anonymous function) jquery-1.9.min.js:5
(anonymous function) download.js:43
b.event.dispatch jquery-1.9.min.js:3
v.handle

EDIT - SOLUTION: Moving the files up to my server seemed to solve the problem as well as this updated jquery: 

$.getJSON('test.php', {object_ID: 'kjiyu-drtfg-hjuyt-hiytr'})
.done(function(data) {
    console.log(data);
    $(data).each(function(index, element) {
        alert(element.projectId + ' ' + element.Project);
        $('#fileList').append('<option value="' + element.projectId + '">' + element.Project + '</option>');
    });
});
Yecats
  • 1,715
  • 5
  • 26
  • 40

1 Answers1

0

Your not returning an array of 'data',

Try this instead,

$.get('test.php', {object_ID: 'kjiyu-drtfg-hjuyt-hiytr'})
  .done(function(data) {
    console.log(data);
    $('#fileList').append('<option value="' + data.projectId + '">' + data.Project + '</option>');
});

.each would loop if your test data looked like,

<?php 
  echo json_encode(array(
              array("projectId"=>"John","Project"=>"Some Project Name"),
              array("projectId"=>"John2","Project"=>"Some Project Name 2")
            ); 
?>

in which case you would use element.projectId inside of the each loop.

shapeshifter
  • 2,967
  • 2
  • 25
  • 39
  • Ahh, how would I code this if my data returned may or may not be an array? Meaning, sometimes it might return 1 and sometimes N – Yecats Apr 26 '13 at 02:40
  • Just always return an array of arrays. echo json_encode(array(array("projectId"=>"John","Project"=>"Some Project Name")); – shapeshifter Apr 26 '13 at 02:41
  • That way there is always rows of data. [0] in this case is your only array. – shapeshifter Apr 26 '13 at 02:42
  • inside of the each loop you need to use element.projectId and element.Project not data.whatever as data is an array of elements. – shapeshifter Apr 26 '13 at 02:43
  • Oh, okay i'll do that. I changed my php to reflect yours above (with leaving my jquery the way it was) and got a new error. (See my original post in 1 minute as it is too long to put in this. – Yecats Apr 26 '13 at 02:43
  • Nope, still having the same error above. Jquery and php code is updated in my original post. – Yecats Apr 26 '13 at 02:47
  • The problem you have is an origin header issue. See if using $.getJSON instead of $.get works – shapeshifter Apr 26 '13 at 02:48
  • See, http://stackoverflow.com/questions/3595515/xmlhttprequest-error-origin-null-is-not-allowed-by-access-control-allow-origin – shapeshifter Apr 26 '13 at 02:49
  • What browser are you using? – shapeshifter Apr 26 '13 at 02:50
  • Chrome. What is the syntax to add the data type to my $.get request? I can't seem to find a good example. – Yecats Apr 26 '13 at 15:20
  • I just moved this up to my server and it works fine. I'll update my above code with the final solution. THank you for your help! – Yecats Apr 26 '13 at 15:55