2009-06-04 38 views
7

私はJQueryで質問があります。私は$.ajax()を自分のコード(Function 1)で使用して、フィールド名とシーケンス番号をctrllerに送り、$_POST['name']$_POST['sequenceno']でデータを取得し、シーケンス番号なしでテーブルのフィールド名を更新します。プレビュー表示パネルが挿入されたフィールドを生成します.. 今私はフィールド名を再度変更しようとしています。生成された表示パネルのフィールドをクリックすると、対応する設定が開き、名前を変更しようとします。フィールドは今すぐ(Function 2)同じAjaxが2回呼び出されました.JQuery

Function1Function2は同じです.. Function1ではフィールド名とシーケンスはありません

Funciton 2では、同じフィールド名を送信したいFunc1

しかし、Function1(sequencenoはカウンタ値)である Function2(sequencenoはクリックされたdiv id(表示パネル))であるのに対し、

どのようにして同じfunc両方とも..私はsepを使う必要がありますか? arateのfuncs ..

も、私は別のURLを持つ2つの別々のfuncsと試みたが、

私のコードがある

 //This is what i insert the field initially 

       $(".TextFieldSettings #fieldTitle").change(function(){ 
      fieldname=$(".TextFieldSettings #fieldTitle").val(); 
    $.ajax({ 
      type: "POST", 
      url: "./server", 
     data: "name="+fieldname+"&sequenceno="+counter, 

       success: function(msg){ 
         }//success 
      });//ajax 

    });//change 

//After inserting to get the updated values in JSON format 

    var htm = $.ajax({ 
     type: "GET", 
      url: "./viewforms", 
     async: false 
     }).responseText; 
     var myObject = eval('(' + htm + ')'); 


    gettype=myObject.attributes[0]["type"]; 
    getlabel=myObject.attributes[0]["labels"]; 

    //showing in my DisplayPanel view 

      $("#labelstr"+counter+"").html(getlabel); 
    });//change 

今 私は表示パネルの表示をクリックすると

  $("#displayPanel div").live("click", function(){ 
          div_id=$(this).attr("id"); 

           var htm = $.ajax({ 
            type: "GET", 
            url: "./getattributes/"+div_id+"", 
            async: false 
           }).responseText; 
           var myObject = eval('(' + htm + ')'); 


           gettype=myObject.attributes[0]["type"]; 
           getlabel=myObject.attributes[0]["labels"]; 
           getsize=myObject.attributes[0]["size"]; 

    if(gettype=='Text') 
    { 
    $(".TextFieldSettings").show(function(){ 
    $(".TextFieldSettings #fieldTitle").val(getlabel);//showing the updated value 
          if(getsize=='100') 
          { 
      $("#fieldSize option:contains(Small)").attr("selected",true); 
          } 
          else if(getsize=='200') 
          { 
     $("#fieldSize option:contains(Medium)").attr("selected",true); 
         } 
       else 
      { 
      $("#fieldSize option:contains(Large)").attr("selected",true); 
      } 
//Again i m changing the fieldname 


     $(".TextFieldSettings #fieldTitle").change(function(){ 
     fieldname=$(".TextFieldSettings #fieldTitle").val(); 


           alert(div_id); 
             $.ajax({ 
              type: "POST", 
              url: "./editsettings", 



                     data: "name="+fieldname+"&sequenceno="+div_id, 
              success: function(msg){ 

              }//success 
              });//ajax 


});//change in text value later*/ 



        });//show 
        }//if type = TEXT 

       });//displaypanel Div clicked 
正しく更新されません

しかし、今私は再びフィールド名を変更しようとすると、別のPOST関数editsettingsを書いていますが、実行はFunc2の代わりにFunc2(最初は変わります)の中に入ります。これは.... 注: $(".TextFieldSettings #fieldTitle").change()は、私のPRG内で2回使用されています。これが原因で更新が間違ってしまうかもしれません。

+1

ここで実際にどの部分が問題になりますか?単一の再利用可能な機能と2つの異なる機能を持つことができるかどうかを知りたいですか? – Fenton

+0

2つの異なるfunction()しかし、両方の名前は $( "。TextFieldSettings #fieldTitle")のようになります。change(function(){}); 同じことだが目的が異なる – useranon

答えて

8

問題のように、両方のイベントハンドラが起動していて、後者が起動するだけです。

jQuery .change()関数は、変更イベントにというイベントハンドラを追加します。既存のものを置き換えるものではありません。前のハンドラを削除する場合は、新しいハンドラを追加する前に、

のようなものが必要です。

私はこれが(私はちょうどapiのドキュメントからそれを見つけた)動作していないと私は今すぐテストすることはできませんのでご注意ください。しかし、一般的な考え方は、イベントハンドラがイベントへの応答を停止するようにするには、ハンドラを削除する必要があるということです。

+0

こんにちは、 私は2回目の変更の前に自分のコードでバインド解除されたものを使用しています...今は2回目の変更を使用したときに働いています...しかし、最初の変更今私の最初の変更に続いて2回目の変更も呼び出されます...しかし、私は最初に呼び出される必要があります...実際に私の最初の変更funcは、最初にフィールドを作成することです..私の2番目の変更は、フィールドはすでに生成されています。現在は何か試しています..フィールドのフィールド設定を編集した後、新しいフィールドを作成することができます(これは新しいフィールドを作成することができます)。 – useranon

+1

これは、変更ハンドラを1つの関数にして、その関数内で条件に基づいて実行するアクションを決定することです。そうすれば、何かをバインド解除する必要はありません。 – Rytmis

5

同じスクリプトを2回追加していませんか?たとえば:

Viewstart:

Scripts/jquery-1.6.1.js 

パーシャルビュー:

<script src="@Url.Content("~/Scripts/jquery-1.6.1.min.js")" type="text/javascript"></script> 

私は同じ問題を持って、私は分版を削除することによってそれを解決しました。

こちらがお役に立てば幸いです。

2

私は別のケースがあります。バインドボタンをクリックするとポストAJAXを2回送ってきました。同じ名前の2つのIDがあるため、トリガーが2回検出されました。

+0

これは実際の答えではないかもしれませんが、私のために働いていました。 :) – darwindeeds

0

私はAmazon WebサービスEC2を使用しているプロジェクトに取り組んでいます。大きなファイル(最大150 MB)をアップロードしています。フロントエンドでAjaxを使用します。そして、バックエンドのスプリングMVC。 私の問題は、SpringコントローラのuploadFile()メソッドが2回呼び出されたことです。私は私のjavascriptにブレークポイントを設定し、javacriptメソッドは2回呼び出されません。これはAWSインスタンスでのみ発生し、私のローカルでは発生しません。そして、それはuploadFile()メソッド呼び出しの間で約90秒です。 その後、ajaxコールバックにエラーが発生します。 = 0、エラーのStatusCodeは=「中止された」 FirefoxのFirebugのは言う、「それは二回いくつかの場所のAJAX呼び出しをバックエンドのかもしれませんが、私は、ネット:: ERR_EMPTY_RESPONSE」

を「 クロムを点検し、私に与えます」。

私は多くの解決策をstackoverflowで検索します。 like
1./e.preventDefault()とe.stopImmediatePropagation()を追加します。 2 ./またはtomcat/confg/server.xmlのmaxSwallowSizeを変更してください 3. $( "#uploadFileForm")unbind( 'submit')submit(function(e) 4. asyncをtrueに変更してタイムアウト値を追加します'POST'、 タイムアウト:60000、 非同期:アヤックス方法 型に。真、上記の作業の

なし

Finaly私は600秒にELBの変化アイドルタイムアウトによって、それをsoltionそして、私のコントローラ。

http://docs.aws.amazon.com/elasticloadbalancing/latest/classic/config-idle-timeout.html https://aws.amazon.com/blogs/aws/elb-idle-timeout-control/

まずは、たくさんの手助けをするstackoverflowで質問に答えてくれたすべての人に感謝します。 解決策は間違いではなく、私の場合ではありません。そしてこの問題は私に3日間かかります。私はあなたの質問に役立つことを願っています。 「ajaxファイア/コール2回」「Springコントローラコール2回」「Ajaxタイムアウト」

関連する問題