Adding Unlimited Form Fields With JQuery Problem.

Posted by TheCREATOR on Stack Overflow See other posts from Stack Overflow or by TheCREATOR
Published on 2010-04-20T02:36:10Z Indexed on 2010/04/20 2:43 UTC
Read the original article Hit count: 357

Filed under:
|

I'm fairly new to JQuery and I'm trying to add multiple form fields for example, <li id="container" id="add_field"><input type="text" name="text" value="text" /></li> but I think my JQuery code is off can some one please help me fix the JQuery code?

Here is the JQuery script.

var count = 0;
$(function(){
    $('li#add_field').click(function(){
        count += 1;
        $('#container').append(
                 '<li><input id="field_' + count + '" name="fields[]' + '" type="text" /></li>' );

    });
});

Here is the html code.

<form method="post" action="index.php">
    <fieldset>
        <ul>
            <li><label for="code">Code: </label>
            <textarea rows="8" cols="60" name="code" id="code"></textarea></li>

            <li id="container" id="add_field"><input type="text" name="text" value="text" /></li>

            <li><label for="comment">Comments: </label>
            <textarea rows="8" cols="60" name="comment" id="comment"></textarea></li>

            <li><input type="submit" name="submit" value="Submit" /></li></ul>
    </fieldset>

</form>

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about XHTML