0

我有一个具有多个字段集的 Dexterity 类型,并且内置的 Javascript 允许在添加或编辑时一次显示一个字段集,这非常棒。

但我想邀请用户按顺序浏览字段集,所以我的理想情况是在最后一个字段集可见之前不会显示“提交”按钮,而是在最后一个字段集之前显示NEXT><PREVNEXT>按钮。

我认为这是一种行为?但是我对如何添加它以及如何控制它有点茫然。我目前正在使用默认的 EditForm,我更愿意只做一个微小的调整,但如果这意味着要自己构建表单,那没关系。我只需要知道这是否是获得此添加的唯一方法,这似乎不太可能。

4

1 回答 1

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());
于 2012-11-03T07:55:53.150 回答