Problem copying an html block when clicking a button

Asked

Viewed 158 times

0

I was able to make sure that when I click the add more fields button, the form is replicated. But the create button started to do the same thing as the add+fields button and not its function of entering the data into the database. Could help me?

<!doctype html>
<html>
    <head>

        <title></title>
        <link rel="stylesheet" href="<?php echo base_url('assets/css/bootstrap.min.css') ?>"/>
   <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    </head>


    <body>

<!-- begin snippet: js hide: false -->

<!-- language: lang-js -->
<script>
    $(function(){
      $('button').on('click', function(){
        $('.info-block:first').clone().insertAfter('.info-block:last');
      });
    });

</script>


    <div class='container'>


<div class='info-block'>
       <h2 style="margin-top:0px">Criar Categorias de Inscrição </h2>
        <form action="<?php echo $action; ?>" method="post">
        <div class="form-group">
            <label for="varchar">Nome Categoria <?php echo form_error('nome_categoria') ?></label>
            <input type="text" class="form-control" name='nome_categoria[]' id="nome_categoria" placeholder="Nome Categoria" value="<?php echo $nome_categoria; ?>" />
        </div>
        <div class="form-group">
            <label for="varchar">Descricao Categoria <?php echo form_error('descricao_categoria') ?></label>
            <input type="text" class="form-control" name='descricao_categoria[]' id="descricao_categoria" placeholder="Descricao Categoria" value="<?php echo $descricao_categoria; ?>" />
        </div>
        <div class="form-group">
            <label for="decimal">Valor Categoria <?php echo form_error('valor_categoria') ?></label>
            <input type="text" class="form-control" name='valor_categoria[]' id="valor_categoria" placeholder="Valor Categoria" value="<?php echo $valor_categoria; ?>" />
        </div>
        <input type="hidden" name='idCategorias_Inscricao[]' value="<?php echo $idCategorias_Inscricao; ?>" /> 

            </form> 

   </div>

   </div>

         <button>Adicionar + campos</button>
        <button type="submit" class="btn btn-primary">Criar</button> 
        <a href="<?php echo site_url('categorias_inscricao') ?>" class="btn btn-default">Cancel</a>

    </body>
</html>
php javascript html codeigniter form

1 answer

1


Add a class to the action button:

<button class="add">Adicionar + campos</button>

And modify the function to work with this class:

<script>
    $(function(){
      $('.add').on('click', function(){
        $('.info-block:first').clone().insertAfter('.info-block:last');
      });
    });

</script>

You can also change the element of the add button, use a <span> or a <p> to better structure the code and even help in styling.

  • I made these changes, but now the create button does nothing else,?

  • I did a test here and it was good. So, just leave this part of JS '$('.add'). on('click', Function() { $('.info-block:first').clone().insertAfter('.info-block:last'); });' and place at the end of the file. Here is the link to the http://codepen.io/FuckingLunatic/pen/QNJYQgtest

  • I did it, but it didn’t happen.Your test here for me doesn’t do anything when you click on the create, which can be : ?

  • ah ta, put the "create" button inside the form tags, or make a Submit call via JS. But the button needs to be inside the form

  • Now changed the error, placing inside the tag form ,keeps falling into the exeption of filling out the form, as if the fields had not been filled in.

  • We solved a problem that created another one. Now you finish this problem and try to solve the form validation

Show 1 more comment

Browser other questions tagged php javascript html codeigniter form

You are not signed in. Login or sign up in order to post.