2011-02-07 133 views
1

我的用戶界面包含一個組合框,用於顯示錶單的類型。然後使用ajax提交表單。回調顯示整個表單和其他信息。問題是第一次提交工作,但第二次提交沒有考慮到表單字段中所做的更改。jQuery如何將事件附加到新創建的對象

  • 在列表中選擇Form1中
  • Form1中顯示有空白字段
  • 用戶填寫表格並提交
  • Form1中與來自用戶的信息以及其他信息再次顯示
  • 用戶更改字段值並提交,但提交舊數據。

我的當前的jQuery(I使用jQuery Form plugin):

$(document).ready(function() { 
    // do stuff when DOM is ready 
    var testCaseList = $('#testCaseId'); 
    testCaseList.live('change', function() { 
     $.ajax({ 
      url: 'populateSteps.htm', 
      type: 'GET', 
      data: 'testCaseId=' + $(this).val(), 
      success: function(data){ 
      $('#formContainer').html(data); 
      var formId = $('#testCaseForm'); 
      var validateButton = $('#validateButton'); 
      validateButton.live('click', function() { 
       // prepare Options Object 
       var options = { 
        url: 'validateTestCase.htm', 
        success: function(data) { 
         $('#formContainer').html(data); 
        } 
       }; 
       // pass options to ajaxForm 
       alert(formId.formSerialize()); 
       formId.ajaxSubmit(options); 
      }); 
      } 
     }); 
    }); 
    }); 

基本上在組合框中改變值後,則顯示形式和點擊事件被附接到形式按鈕。點擊只提交表單。

我使用live方法來附加事件,因爲每次提交後都會顯示錶單。我知道這不是AJAX,但我必須這樣做,因爲Spring處理不好部分形式。

我可以做更好的工作,將事件附加到新創建的表單使用綁定,但我不知道我應該把代碼放在哪裏。該表單使用JSP顯示,並且我嘗試將

HTML/JSP code ... <script type="text/javascript"> 
    $(document).ready(function() { 
    // Attach the event to the form 
    } </script> 

之後的JSP代碼但腳本未執行。

編輯該腳本未執行,因爲我的腳本是錯誤的:缺少);

<script type="text/javascript"> 
     $(document).ready(function() { 
     // Attach the event to the form 
     });  
</script> 

現在,它的工作,但我仍然不知道爲什麼live結合使用表單中的舊數據。

回答

0

當我要綁定到動態創建的對象我使用的liveQuery插件像這樣的活動:

$('.zoom').livequery('click' , function(e){ 
     x = Math.round(e.pageX - $(this).offset().left); 
     y = Math.round(e.pageY - $(this).offset().top); 
     sendRequest(71609); 
    }); 

的liveQuery:http://plugins.jquery.com/project/livequery

+0

有什麼用`live`區別? – Sydney 2011-02-07 17:37:45

相關問題