AJAX/原型重置调用答案

【问题标题】：AJAX/prototype reset callAJAX/原型重置调用
【发布时间】：2010-11-30 17:04:05
【问题描述】：

我有一个与 AJAX / 原型相关的问题。我有一个 AJAX 调用当前内联放置在 onclick（我保证我会把它移出那里:) 事件中，看起来像这样：

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);}});"

名为 ajax.php 的文件然后从 $_GET[] 获取数据，显示一个小的文本输入字段。当填写并单击提交按钮时，它会调用一个从文件中读取相关数据的函数，并在屏幕上打印结果。所有这些代码的目的是库存检查。

所以，当用户点击上面定义的 onclick 的“获取库存”按钮时，一切正常，用户填写码数，弹出正确的结果，大家都很高兴。但是，如果用户想要再次检查库存，则需要刷新整个页面，这使得它不太可用。如果不是，那么当点击“获取库存”按钮时，用户将再次获得上次检查的相同结果，而不是文本输入字段。

所以，我的问题是，如何在进行一次库存检查后，让整个事情自行重置，以便下次用户点击“获取库存”按钮时，系统会提示他填写文本再次输入字段，从而得到新的结果。

如果我没有说清楚，我很抱歉。我对 AJAX 和原型非常陌生，这是我需要完成的同事的工作...谢谢！

【问题讨论】：

标签： ajax prototypejs call reset

【解决方案1】：

啊，我明白了，

我不认为 Ajax.Updater 那样工作；看看文档： 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);
            }
});

要尝试的事情：

在您的 ajax.updater 调用中触发 onComplete 事件时，在重新填充之前清除文本输入字段。
提醒响应以确保您从服务器获得不同的响应。

*使用 Fiddler 确保您传入不同的 productId
将 onComplete 更改为 onSuccess

希望对你有帮助

【讨论】：

谢谢，它对调试过程有帮助。最后，我把它从onclick中去掉了，并设置了整个函数，使其在调用onclick的同时显示文本输入框。这样，每次用户单击该按钮时它都会重新启动。

【解决方案2】：

既然您已承诺将代码移出 onclick 处理程序，请执行以下操作：

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);
        }
});

【讨论】：