-1

Hi I have this jQuery Function to duplicate form fields. Now I need to process them with PHP and my problem is that the cloned elements have the same input name.

I would like to add and variabel on the end of the name like _1 _2 _3 and so on. Also it would be great to put in a hidden field the amount of cloned elements to process them in a loop.

I'm really not good in jQuery and need it pretty quick otherwise I would start reading documentary about it and do it myself.

Maybe u guys can help me out. Would appriciate it a lot :)

There is the jQuery Part:

$(document).ready(function() {
$('#btnAdd').click(function() {
    var num     = $('.clonedInput').length;
    var newNum  = new Number(num + 1);

    var newElem = $('#input' + num).clone().attr('id', 'input' + newNum);

    newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);
    $('#input' + num).after(newElem);

    $('#btnDel').removeAttr('disabled');

    if (newNum == 10)// Max
        $('#btnAdd').attr('disabled','disabled');
});

$('#btnDel').click(function() {
    var num = $('.clonedInput').length;

    $('#input' + num).remove();
    $('#btnAdd').removeAttr('disabled','');

    if (num-1 == 1)
        $('#btnDel').attr('disabled','disabled');
});

$('#btnDel').attr('disabled','disabled');

});

And here the HTML 

<div id="input1" class="clonedInput">
<!-- Elements to clone -->
    <div class="control-group">
        <label class="control-label" for="">Firmenname</label>
        <div class="controls">
            <input type="text" class="input-xlarge {validate:{required:true}}" rel="popover" data-content="Der Firmenname ist ein wichtiger Hinweis." data-original-title="Hilfe" id="firma" name="firma">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Branche</label>
        <div class="controls">
            <input type="text" class="input-xlarge" name="branche">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Anschrift</label>
        <div class="controls">
            <input type="text" class="input-xlarge" name="anschrift">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Ansprechpartner</label>
        <div class="controls">
            <input type="text" class="input-xlarge" name="ansprechpartner">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Tel.</label>
        <div class="controls">
            <input type="text" class="input-xlarge">
        </div>
    </div>
<!-- END Elements to clone -->    
</div>
4

2 に答える 2

1

入力名はすべて, などname[]ではなくname_1、name_2.PHP がこの名前形式を認識$_POST['name']し、その名前を持つ各入力の要素を持つ配列を作成します。

要素に一意の ID を与える必要があります。しかし、おそらく、複製された入力には ID がまったく必要ないため、この問題を完全に回避できます。

jquery-dynamic-form プラグインも参照してください。ただし、確認したところ、この問題に対処していません (実際、各行に + および - ボタンが埋め込まれているデモでは ID が重複しているため、有効な DOM ではありません)。

ところで、使用する必要はありませんnew Number。書くだけ：

var newNum = num+1;
于 2012-10-04T00:00:29.037 に答える
0

一意の ID を作成するには、0 から始まり、新しいクローンを作成するたびに 1 ずつ増加するカウンターを保持するだけです。次に、このカウンターを名前フィールドに連結します。

于 2012-10-04T00:05:50.883 に答える