AJAX/prototype reset call

I have an AJAX / prototype related question. I have an AJAX call currently placed inline, in the onclick (i promise i'll move it out of there :) event, looking like this:

onclick="var pn = $('yards').value; $('inventory').update('Working...');
new Ajax.Updater('inventory','ajax.php?ac=checkInventory&productID='.$someproductid.'&yards='+pn,{method:'get', evalScripts: true, asynchronous: true, onComplete:function(tr){$('inventory').update(tr.responseText);}});"

File called ajax.php then gets the data from $_GET[], displays a small text input field. When filled in and clicked on a submit button, it calls a function which reads the relevant data from the file, and prints a result on the screen. The purpose of all this code is inventory check.

So, when a user clicks on the "get inventory" button with the onclick defined as above, everything works 开发者_运维问答nice, the user fills the yardage, the right result pops up, everybody happy. But what makes it less usable is the fact that in case a user wants to do another inventory check, the entire page needs to be refreshed. If it's not, then when clicking on "get inventory" button, the user will be getting the same result of the last check again, not the text input field.

So, my question is, how do I make that after one inventory check, the whole thing sort of resets itself so that the next time a user clicks on "get inventory" button, he'll be offered to fill the text input field again, and hence get the new result.

I'm sorry if I didn't make myself clear enough. I'm very new to AJAX and prototype, and this is my colleague's work I need to finish...Thanks!

Ah I see,

I don't think Ajax.Updater works like that; have a look at the doc: http://www.prototypejs.org/api/ajax/updater

new Ajax.Updater({ success: 'items', failure: 'notice' }, '/items', {
  parameters: { text: $F('text') },
  insertion: Insertion.Bottom
});

var pn = $('yards').value; 
    $('inventory').update('Working...');
    new Ajax.Updater('inventory','/ajax.php
,{ 
     parameters: { ac: 'checkInventory'
                  , productId: /*put productId here*/
                  , yards:/*put yards here too*/
                 }
, method:'get'
, evalScripts: true
, asynchronous: true
, onSuccess:  function(tr){
            //try an alert(tr.repsonseText); just to see what you get back
            $('inventory').update(tr.responseText);
            }
});

Things to try:

• Clear the text input field before your repopulate it when the onComplete event fires in your ajax.updater call.

• Alert the response to make sure your getting a different response from the server.

  *Use Fiddler to make sure your passing in a different productId

• Change onComplete to onSuccess

Hope this helps

Since you've promised to move the code out of the onclick handler do:

var inv = $('inventory');

inv.update('Working...');

new Ajax.Request('ajax.php', {
    method:'get',
    parameters:{
        ac:'checkInventory',
        yards:$('yards').value
    },
    onSuccess: function(response)
        {
            inv.update(response.responseText);
        }
});