CODEWITHSUNDEEP
javascriptjquerytwitter-bootstrap
Boby
Boby

Reputation: 1202

Dynamic input field not working

Good day, i've a trouble with my script. I want to make a dynamic field. Please kindly check my script first

     $(document).ready(function() {
        var max_fields      = 10;
        var wrapperss         = $(".wrappers");
        var add_button      = $(".btn");
        var x = 1;
        $(add_button).click(function(e){
            e.preventDefault();
            if(x < max_fields){
                x++; 
                $(wrapperss).append('<div><input type="text" name="nama[]"/><a href="#" class="hapus">Hapus</a></div>'); 
            }
        });
        
        $(wrapperss).on("click",".hapus", function(e){
            e.preventDefault(); $(this).parent('div').remove(); x--;
        })
    });


     
<button class="btn">Tambah baris</button>
       <?php echo form_open('inputbanyak/save'); ?>
       <div class="wrappers">
        <div><input type="text" name="nama[]"></div>
    
    </div>   
     <input type='submit' class='button'>
       <?php echo form_close(); ?>

By the way, i'm using bootstrap. when i press Tambah baris nothing change.

Upvotes: 0

Views: 542

Answers (2)

otnieldocs
otnieldocs

Reputation: 325

Of course they won't First thing that you must really note is your css class naming. Here is your css class, "btn tmbh". 

<button class="btn tmbh">

In css this means you are using 2 css class, first btn class, and second is tmbh class. But eventhough you are using those css class by that way, you are still make some mistakes in your jquery path for this code

var add_button      = $(".btn tmbh");

I dont really got what do you want to try, but I can guess what do you want. Here we go... may be you want to define your button class ass ".btn_tmbh" then you call that css class in your jquery code like this

varr add_button = $(".btn_tmbh")

But if you want to treat your css class as 2 different class that would be come as composite identifier (by using 2 different css class, I don't know how u are using that, Instead of using class as identifier, I think the better way is to use id), what you need is to use css path like this.

suppose we are got 2 different class ".btn" and "tmbh" and with two different element. We need to define our css class path like this

$(".btn > .tmbh")

more precise css path is like this

$("<your-element-type>.btn > <your-element-type>.tmbh>")

If you want to use two different class in one same element you can use this class path format

.class1.class2

can be much thing, like button, input, div, ul, li, table, tr, td, and other html tags.

So I think you need to learn more about css path rather than only search sample code without you fully understand that code.

Upvotes: 1

Vijay
Vijay

Reputation: 3023

Multiple class selector is wrong, please remove the space and add . :

var add_button = $(".btn.tmbh");//$(".btn tmbh");

In addition, you can only use 1 css class (btn or tmbh) to target your button for action, you dont need both.

also one spelling mistake:

var wrapperss = $(".wrappers");//$(".wrapperss");

Upvotes: 3

Related Questions