2011-06-23 13 views
0

初めてjQuery formプラグインをjQuery-uiタブ内で使用しようとしています。フォームをタブに読み込んでフォームを送信することができます。要求は正常に処理され、データが計画どおりにデータベースに追加されます。フォームのクリーンなバージョンにリダイレクトすると、HTMLもタブに入れられますが、javascriptエラーが発生します。$ is not definedは、フォームページでjQueryが最初に使用された行を参照しています。2回目の使用時にjQuery.formプラグインの問題

私はまだ発見していない魔法があると仮定しています。それが初めて働いた場合、2度目にはうまくいくはずですね。ここで


は、私が今やっているものです:

アヤックス

<div id="tabs"> 
<ul> 
    <li>#{a @Shifts.blank()}<span>New Shift</span>#{/a}</li> 
    <!-- above line renders as 
    <li><a href="/shifts/new"><span>New Shift</span></a></li> 
    --> 
</ul> 
</div> 
経由でのjQuery-UI tabs要素にロードされるマイフォーム

<div id="new-shift" class="${type.name}"> 

    <h2 id="crudBlankTitle">&{'crud.blank.title', type.modelName}</h2> 

    <div class="objectForm"> 
    #{form action:@create(), id: 'new-shift-form', enctype:'multipart/form-data'} 
     #{crud.form /} 
     <p class="crudButtons"> 
      <input type="submit" name="_save" value="&{'crud.save', type.modelName}" /> 
      <input type="submit" name="_saveAndAddAnother" value="&{'crud.saveAndAddAnother', type.modelName}" /> 
     </p> 
    #{/form} 
    </div> 

</div> 

と1回フォームプラグインがアップデート

<script> 
$(function() { 
     var tabs = $("#tabs"); 
     tabs.tabs({ 
       load: function (event, ui) { 
        $('#new-shift-form').ajaxForm({ 
         target: '#new-shift' 
        }); 
       } 
     }); 
}); 
</script> 

を適用されてロードされています:私は今だけでなくajaxSubmitを使用して、これを試してみたが、結果は同じです。 2回目の読み込み時に "$は定義されていません"。ロード時にフォームプラグインを適用するのではなく、liveを使用しても役に立たなかった。私は次に何をしようとするのか本当に迷っています。

$('#new-shift-form').live("submit", function() { 
    $(this).ajaxSubmit({ 
     target: '#new-shift', 
     clearForm: true, 
     replaceTarget: true 
    }); 
    return false; 
}); 

答えて

-1

多分あなたからの応答を取得しようとしているページには、重複したIDを作成し、提出をめちゃくちゃ、同じIDを持つ要素が含まれています。

+0

レンダリングされたマークアップを通過しましたが、重複IDはありません。もちろん、フォームがロードされる2回目からのIDは、最初のIDと一致しますが、2番目のIDが追加される前に最初のIDを削除する必要があると思います。 –

関連する問題