form not created dynamically

Question

I have written a jQuery plugin as a form element that I want to reuse throughout mysite.

(function ( $ ) {
    $.fn.create = function() {
        var form = '<div id="form" class="container">';
        form += '<div>User Login</div>';
        form += '<form action="/create" method="post">';
        form += '<input type="text" name="name" placeholder="name">';
        form += '<input type="email" name="email" placeholder="email">';
        form += '<button type="submit">Login</button>';
        form += '</form>';
        form += '</div>';
        return this.append(form);
    };
}( jQuery ));

In HTML view,

<div id="#newForm"></div>

<script>
$(document).ready(function(){
    $("#newForm").create(); 
});
</script>

However, the form does not get rendered onto #newForm

http://stackoverflow.com/questions/6964927/how-to-create-a-form-dynamically-via-javascript — Puvanarajan, Feb 05 '14 at 08:30

score 6 · Accepted Answer · answered Feb 05 '14 at 08:21

6

You have an # in the id of the target div, remove the prefixed # and it should be fine

<div id="newForm"></div>

Demo: Fiddle

answered Feb 05 '14 at 08:21

Arun P Johny

384,651
66
527
531

oh awesome! thanks for catching that! – guest Feb 05 '14 at 08:24

form not created dynamically

1 Answers1