javascript,html form and django

hello

i want ta create a html form using javascript dynamic input

but the javascript script not working,where is wrong ?

my code html form...

<form id="bookForm" method="post" class="form-horizontal">{% csrf_token %}
    <div class="form-group">
        <label class="col-xs-1 control-label">Book</label>
        <div class="col-xs-4">
            <input type="text" class="form-control" name="book[0].title" placeholder="Title" />
        </div>
        <div class="col-xs-4">
            <input type="text" class="form-control" name="book[0].isbn" placeholder="ISBN" />
        </div>
        <div class="col-xs-2">
            <input type="text" class="form-control" name="book[0].price" placeholder="Price" />
        </div>
        <div class="col-xs-1">
            <button type="button" class="btn btn-default addButton"><i class="fa fa-plus"></i></button>
        </div>
    </div>

    <!-- The template for adding new field -->
    <div class="form-group hide" id="bookTemplate">
        <div class="col-xs-4 col-xs-offset-1">
            <input type="text" class="form-control" name="title" placeholder="Title" />
        </div>
        <div class="col-xs-4">
            <input type="text" class="form-control" name="isbn" placeholder="ISBN" />
        </div>
        <div class="col-xs-2">
            <input type="text" class="form-control" name="price" placeholder="Price" />
        </div>
        <div class="col-xs-1">
            <button type="button" class="btn btn-default removeButton"><i class="fa fa-minus"></i></button>
        </div>
    </div>

    <div class="form-group">
        <div class="col-xs-5 col-xs-offset-1">
            <button type="submit" class="btn btn-default">Submit</button>
        </div>
    </div>
</form>

javascript

<script>  $(document).ready(function() {      var titleValidators = {              row: '.col-xs-4',   // The title is placed inside a <div class="col-xs-4"> element              validators: {                  notEmpty: {                      message: 'The title is required'                  }              }          },          isbnValidators = {              row: '.col-xs-4',              validators: {                  notEmpty: {                      message: 'The ISBN is required'                  },                  isbn: {                      message: 'The ISBN is not valid'                  }              }          },          priceValidators = {              row: '.col-xs-2',              validators: {                  notEmpty: {                      message: 'The price is required'                  },                  numeric: {                      message: 'The price must be a numeric number'                  }              }          },          bookIndex = 0;        $('#bookForm')          .formValidation({              framework: 'bootstrap',              icon: {                  valid: 'glyphicon glyphicon-ok',                  invalid: 'glyphicon glyphicon-remove',                  validating: 'glyphicon glyphicon-refresh'              },              fields: {                  'book[0].title': titleValidators,                  'book[0].isbn': isbnValidators,                  'book[0].price': priceValidators              }          })            // Add button click handler          .on('click', '.addButton', function() {              bookIndex++;              var $template = $('#bookTemplate'),                  $clone    = $template                                  .clone()                                  .removeClass('hide')                                  .removeAttr('id')                                  .attr('data-book-index', bookIndex)                                  .insertBefore($template);                // Update the name attributes              $clone                  .find('[name="title"]').attr('name', 'book[' + bookIndex + '].title').end()                  .find('[name="isbn"]').attr('name', 'book[' + bookIndex + '].isbn').end()                  .find('[name="price"]').attr('name', 'book[' + bookIndex + '].price').end();                // Add new fields              // Note that we also pass the validator rules for new field as the third parameter              $('#bookForm')                  .formValidation('addField', 'book[' + bookIndex + '].title', titleValidators)                  .formValidation('addField', 'book[' + bookIndex + '].isbn', isbnValidators)                  .formValidation('addField', 'book[' + bookIndex + '].price', priceValidators);          })            // Remove button click handler          .on('click', '.removeButton', function() {              var $row  = $(this).parents('.form-group'),                  index = $row.attr('data-book-index');                // Remove fields              $('#bookForm')                  .formValidation('removeField', $row.find('[name="book[' + index + '].title"]'))                  .formValidation('removeField', $row.find('[name="book[' + index + '].isbn"]'))                  .formValidation('removeField', $row.find('[name="book[' + index + '].price"]'));                // Remove element containing the fields              $row.remove();          });  });  </script>

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users+unsubscribe@googlegroups.com.
To post to this group, send email to django-users@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/a541281f-31b9-4b08-9f29-b39d010d13a8%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.