2012-11-02 49 views
0

我有一個敏捷類型有多個字段集,並且內置Javascript允許顯示一個字段集時添加或編輯是美好的。如何添加一個「下一個字段集」按鈕添加/編輯表單爲一個敏捷Plone類型

但我想請用戶按順序通過的fieldsets走,所以我理想的情況是不存在的「提交」按鈕,直到最後一個字段集是可見的,而不是呈現NEXT><PREVNEXT>按鈕,直到最後的字段集。

我認爲這是一種行爲?但是,在如何添加以及如何控制它方面我有點不知所措。我目前使用的是默認的EditForm,我更願意只做一些小小的調整,但如果這意味着要下降到自己創建窗體,那沒關係。我只需要知道這是否是獲得這一補充的唯一方法,這似乎不太可能。

回答

1

該字段可以用來添加'上一個'和'下一個'按鈕以及一些額外的JavaScript魔術。以下是我在當前項目中使用的內容:

var prevnext = { 
    formTabs: null, 

    next: function() { prevnext.formTabs.data('tabs').next(); prevnext._scrollToTop(); }, 
    prev: function() { prevnext.formTabs.data('tabs').prev(); prevnext._scrollToTop(); }, 

    _scrollToTop: function() { 
     $(window).scrollTop(prevnext.formTabs.closest('form').offset().top); 
    }, 

    showButtons: function(event, index) { 
     var tabs = prevnext.formTabs.data('tabs'), 
      index = typeof(index) === 'undefined' ? tabs.getIndex() : index, 
      current = tabs.getTabs()[index], 
      count = tabs.getTabs().length; 

     $('#prevnext_previous').toggle(index !== 0); 
     $('#prevnext_next').toggle(index !== (count - 1)); 

     $('.formControls:last :submit[name=form_submit]').toggle(index ===)count - 1)); 
    }, 

    init: function() { 
     var tabs; 
     prevnext.formTabs = $('.formTabs'); 
     tabs = prevnext.formTabs.data('tabs'); 
     if (tabs.getTabs().length > 0) { 
      if ($('fieldset#fieldset-distribution').length === 0) 
       return; 
      $('.formControls:last :submit:first') 
       .before($('<input id="prevnext_previous" class="context" ' + 
          '  type="button" value="" />') 
         .val('< Previous') 
         .click(prevnext.prev)) 
       .before(document.createTextNode(' ')); 
      $('.formControls:last :submit:first') 
       .before($('<input id="prevnext_next" class="context" ' + 
          '  type="button" value="" />') 
         .val('Next >') 
         .click(prevnext.next)) 
       .before(document.createTextNode(' ')); 
      prevnext.showButtons(); 
      tabs.onClick(prevnext.showButtons); 
     } 
    } 
}; 

$(prevnext.init()); 
相關問題