Whenever a web page is requested and returned to the browser - whether
this is through AJAX or a new page view - the server tells the browser
what type of content it is being served and whether or not the request
was carried out successfully. Prototype can access this information,
and indeed does to work out whether to use onSuccess and onFailure.

But it can also see what type of content is returned, and if it sees
JSON, prototype will automatically decode it into a javascript object
for you. You still need php to tell it what the content type is and
you do that before any output is made with the following line:

header('Content-type: text/json');

You can then return an associative array encoded into json:

return json_encode($assocArray);

Now in prototype, it does automatically decode this for you. I can't
remember off the top of my head where it goes! But I remember reading
that prototype will do this automatically. The long way round is:

onSuccess: function(transport){
     var json = transport.responseText.evalJSON();

And in fact, the prototype short cut is rendered somewhat irrelevant
here as if the data you're transporting needs to be secure according
to a logged in user, you need to make the returned JSON non-
executionable, or a default constructor included through XSS could
hijack your data. So the correct way is something like this:

in PHP:
return '/*' . json_encode($assocArray) . '*/';

then in JS:

onSuccess: function(transport){
     var jsObj = transport.responseText.substr(2,
transport.responseText - 2).evalJSON(); // chop the comments off start
and end

Then json has your javascript object in.

For your second issue.

>From ajax you get a name and id, you insert those into the dropdown.
Then, you need a way of selecting the <option> you just inserted into
the <select>, there are lots and lots of ways to do this. I'm sure
there is a better way of doing this, but what I'd do is when I add it,
give it an id. You can use Element#Identify() or just use it's id
prefixed by some arbitrary string. Then something like this:

$$('select#selectID > option').each(function(option) { option.selected
= false; // make sure nothing else is set to selected });
$('idofOptionYouJustAdded').selected = true;

I haven't tested any of the code in this, but the basis of all of it
should be right. Come to think of it I've never seen selected used
like that as a property of a JS object, apart from the googling I
literally just did!

On Sep 17, 11:22 pm, "Bobby.D" <[EMAIL PROTECTED]> wrote:
> I've fiddled with Prototype/Script.aculo.us and want to start using
> JSON when interacting with my PHP Code. So far I'm good, I've got some
> data being passed to my PHP, it gets process and then encoded to JSON.
> Now, I need to figure out how to use that data in my onSuccess
> function....Can anyone help?
> Also, this is a side now, but I've got a drop down box populated from
> a DB and an option to add to the list. I'm using just the AJAX request
> to make the change. Basically, user click "Add New Defendant" a JS
> Prompt appears, the user enters the new title, upon submit the AJAX
> gets called inserts the new defendant name into the database and
> return the Name (which I've already got) and the id (this is important
> because it's the value of each select...) I am looking to change the
> selected index of the drop down box to match what the user just
> entered, but I can't figure out how to do it. I know this isn't a
> Prototype or Script.aculo.us issue, but if anyone has a suggestion it
> would be much appreciated.
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 

Reply via email to