SheepIt多层嵌套

时间:2013-11-06 19:07:12

标签: javascript jquery html forms

我有SheepIt插件的问题。我试图做多嵌套表单,但第三级表单不起作用。我看了这个问题Can I have multiple levels of nested cloned forms using SheepIt JQuery plugin?

这是我的工作:http://jsfiddle.net/aEfFE/2/

正如您所看到的,当您点击“Dodaj plik”或“Dodaj wersje”时没有问题,但是当您点击“Dodaj odcinek”时,整个表格都会崩溃。字段文件仅添加到表单的第一个元素。

我的HTML:

<div class="anime-form-container">
            <div id="addEpisodeForm">
                <!-- Form template-->
                <div id="addEpisodeForm_template">
                    <label for="addEpisodeForm_#index#_episodeNumber">Numer odcinka <span id="addEpisodeForm_label"></span></label>
                    <input id="addEpisodeForm_#index#_episodeNumber" name="anime[episode][#index#][episodeNumber]" type="text" size="15" maxlength="10" />
                    <a id="addEpisodeForm_remove_current"><img class="delete" src="<?=ADRES_THEME?>images/cross.png" width="16" height="16" border="0"></a>


                    <!-- Embeded sheepIt Form -->
                    <div style="margin-left:50px; overflow:hidden;">
                        <label>Wersje</label>

                        <div id="addEpisodeForm_#index#_episodeVersion">

                            <!-- Nested form template-->
                            <div id="addEpisodeForm_#index#_episodeVersion_template">
                                <label for="addEpisodeForm_#index#_episodeVersion_#index_episodeVersion#_version">Wersja <span id="addEpisodeForm_#index#_episodeVersion_label"></span></label>
                                <select id="addEpisodeForm_#index#_episodeVersion_#index_episodeVersion#_version" name="anime[episode][#index#][episodeNumber][#index_episodeVersion#][version]" >
                                    <option>1</option>
                                    <option>2</option>
                                </select>
                                <a id="addEpisodeForm_#index#_episodeVersion_remove_current"><img src="<?=ADRES_THEME?>images/cross.png" width="16" height="16" border="0"></a>


                                <!-- Embeded Embedded sheepIt Form --> 
                                <div style="margin-left:50px; overflow:hidden;">
                                <label>Pliki</label>      
                                    <div id="episodeVersion_#index_episodeVersion#_episodeFile">

                                        <!-- Nested form template-->
                                        <div id="episodeVersion_#index_episodeVersion#_episodeFile_template">
                                            <label for="episodeVersion_#index_episodeVersion#_episodeFile_#index_EpisodeFile#_file">Plik <span id="episodeVersion_#index_episodeVersion#_episodeFile_label"></span></label>
                                            <input id="episodeVersion_#index_episodeVersion#_episodeFile_#index_EpisodeFile#_file" name="anime[episode][#index#][episodeNumber][#index_episodeVersion#][version][#index_EpisodeFile][file]" type="text" size="15" maxlength="10" />
                                            <a id="episodeVersion_#index_episodeVersion#_episodeFile_remove_current"><img src="<?=ADRES_THEME?>images/cross.png" width="16" height="16" border="0"></a>
                                        </div>
                                        <!-- /Nested form template-->

                                        <!-- No forms template -->
                                        <div id="episodeVersion_#index_episodeVersion#_episodeFile_noforms_template">Brak plików</div>
                                        <!-- /No forms template-->

                                        <!-- Controls -->
                                        <div id="episodeVersion_#index_episodeVersion#_episodeFile_controls" class="controls">
                                            <div id="episodeVersion_#index_episodeVersion#_episodeFile_add"><a><span>Dodaj plik</span></a></div>
                                        </div>
                                        <!-- /Controls -->

                                    </div>
                                </div>
                                <!-- /Embeded Embedded sheepIt Form -->



                            </div>
                            <!-- /Nested form template-->

                            <!-- No forms template -->
                            <div id="addEpisodeForm_#index#_episodeVersion_noforms_template">Brak wersji</div>
                            <!-- /No forms template-->

                            <!-- Controls -->
                            <div id="addEpisodeForm_#index#_episodeVersion_controls" class="controls">
                                <div id="addEpisodeForm_#index#_episodeVersion_add"><a><span>Dodaj wersje</span></a></div>
                            </div>
                            <!-- /Controls -->

                        </div>

                    </div>
                    <!-- /Embeded sheepIt Form -->


                </div>
                <!-- /Form template-->

                <!-- No forms template -->
                    <div id="addEpisodeForm_noforms_template">Brak odcinków</div>
                <!-- /No forms template-->

                <!-- Controls -->
                <div id="addEpisodeForm_controls">
                    <div id="addEpisodeForm_add"><a><span>Dodaj odcinek</span></a></div>
                </div>
                <!-- /Controls -->
            </div>
        </div>

和js:

$(document).ready(function() {
            var sheepItForm = $('#addEpisodeForm').sheepIt({
                separator: '',
                allowRemoveLast: false,
                allowRemoveCurrent: true,
                allowRemoveAll: false,
                allowAdd: true,
                allowAddN: true,
                maxFormsCount: 0,
                minFormsCount: 1,
                iniFormsCount: 1,
                nestedForms: [{
                        id: 'addEpisodeForm_#index#_episodeVersion',
                        options: { 
                             indexFormat: '#index_episodeVersion#',
                             maxFormsCount: 0,
                             nestedForms: [{
                                id: 'episodeVersion_#index_episodeVersion#_episodeFile',
                                options: {
                                    indexFormat: '#index_EpisodeFile#',
                                    minFormsCount: 1,
                                    iniFormsCount: 1

                                }}
                            ]
                        }
                    }
                ]
            });

        });

0 个答案:

没有答案