2012-01-05 17 views
0

私は2007年に建てられたサイトを持っています。私はいくつかのアヤックスのものをやっていて、それはうまくいきました..今日、そのサイトの所有者は私に連絡し、ワーキング。ajaxフォームmootoolsと提出

は、私が見てみるために行き、コンソールは、提出時に、それがエラーになったことを示した。 危険なヘッダ「接続」

私は、これはブラウザのセキュリティか何かの変化でなければならなかったと仮定を設定することを拒否し、コードが変更されず、最後にすべてがうまくいきましたので、私はそれを見ました。だから私はいくつかのグーグルを行い、他の人がこれに言及していることを発見しました。その解決策はmootoolsを更新することでした。 APIが変更されたので、すべてを修正しました。すべてうまくいくように見えましたが、それはできませんでした。

$('application_form').addEvent('submit', function(e) { 
    new DOMEvent(e).stop(); 

    updateText("Sending..."); 
    var progress_bar = $('bar'); 
    progress_bar.empty().addClass('ajax-loading'); 
    this.send({ 
    update: progress_bar, 
    onSuccess: function(e) { 
     progress_bar.removeClass('ajax-loading'); 
     (function() { mySlide.slideOut() }).delay(1500); 
    } 
    }); 
}); 

これはむしろapplication_formのaction属性で指定された実際の.phpスクリプトよりURL [Objectオブジェクト]、に行くAjaxのリクエストになり...私は行くためにそれをしませ指示するURLオプションを指定してみました[オブジェクトオブジェクト]にはいいですが...

答えて

0

ここには、あなたをもとにした実際の例があります。
アップグレードするのは難しいことではありません。

http://jsfiddle.net/K976E/3/

はここjsfiddleがなくなった場合などにはhtmlコードです。

<!DOCTYPE HTML> 
<html> 
    <body> 
     <form id='application_form' action='http://www.scoobydoo.com/cgi-bin/scoobysnack'> 
      Count of Scooby Snacks: <input type='text' size='5' /><br /> 
      <input id='submitButton' type='submit' value='Rut Roh Shaggy!'/>    
     </form> 
     <div id='bar' style='margin-top:20px'> 
      Yikes! 
     </div> 

    </body> 
</html> 

そして、ここでのJavaScript(onLoadの中の場所)です:

new Form.Request('application_form', 'bar', { 
    onSend: function(){ 
    updateText("Sending..."); 
    var progress_bar = $('bar'); 
    progress_bar.empty().addClass('ajax-loading'); 
     $('submitButton').set('value', 'Sending the form...').set('disabled', true); 
    }, 
    onComplete: function(){ 
    var progress_bar = $('bar'); 
    progress_bar.removeClass('ajax-loading'); 
    //(function() { mySlide.slideOut() }).delay(1500);   
    } 
}); 


function updateText(txt){ 
    // do something here... 
} 

...といや、私は再度有効onCompleteの中にボタンを提出しなかった...

+0

ものですForm.Requestに 'bar'文字列が渡されていますか? – patrick

+0

更新する必要があるIDのIDです。 ここから: "new Form.Request(form、update [、options]);" ここから:[リンク](http://mootools.net/docs/more/Forms/Form.Request)、 更新あり: 更新: "update - (混合)応答で更新するElementまたは要素の文字列ID。" 私はあなたのプログレスバーIDを投げただけですが、その結果は、要素の内部htmlを結果に置き換えて、ajax呼び出しによって要素を更新するショートカットです。私は決してそれを使用しません。 –