$('.add').live('click', function()

Question

i can't seem to be able to put option tag in my javascript. do help me sifu.
what i'm trying to do there is the function for the add button.

    var scntDiv = $('.input');
    var i = $('.input p').size() + 0;

$('.add').on('click', function() {
            $('<p><input type="text" name="barcode' + i + '" id="textbox_input1" placeholder="Barcode"/>                <input type="text" name="item' +i+ '" id="textbox_input1" placeholder="Item"/>              <input type="number" name="qtty' +i+ '" id="textbox_input1" placeholder="Quantity"/>                <input type="number" name="min' +i+ '" id="textbox_input1" placeholder="Minimum"/>              <select name="category' +i+ '" id="textbox_input1"/><option value="Grocery">Grocery</option><option value="Furniture">Furniture</option></select>               <input type="text" name="price' +i+ '" id="textbox_input1" placeholder="Price"/>                <input type="text" name="promo' +i+ '" id="textbox_input1" placeholder="Promo"/>                <button type="button" class="remove" id="button">Remove</button></p>').appendTo(scntDiv);
            i++;

            return false;

    });

please help me. my problem is the option value does not appear when the add button is clicked. this

<select name="category' +i+ '" id="textbox_input1"/><option value="Grocery">Grocery</option><option value="Furniture">Furniture</option></select>

does not give out any option in the script.

Please don't use `live`, it has been deprecated long time ago, use `on`. Check the docs for more info. — elclanrs, Apr 16 '13 at 03:47
Java is not JavaScript. If this code is used in a Java Web application, the answer would be oriented to JavaScript/jQuery, not to Java. — Luiggi Mendoza, Apr 16 '13 at 03:48

score 0 · Answer 1 · edited May 23 '17 at 11:57

0

Change live to on:

$('body').on('click', '.add', function() {
    // do something
});

Note: change 'body' to the parent element of .add, preferably one with an ID.

Please also see jQuery 1.9 .live() is not a function and jQuery - how to use the “on()” method instead of “live()”?

JSfiddle: http://jsfiddle.net/samliew/tPdyT/

edited May 23 '17 at 11:57

Community

1
1

answered Apr 16 '13 at 03:52

Samuel Liew

76,741
107
159
260

?. still does not enable the option values. please help me sifu – serenna Apr 16 '13 at 03:56

score 0 · Answer 2 · answered Apr 16 '13 at 04:00

I recommend NOT using .live() and upgrading to the latest version of jQuery 1.9.1.

.live() is deprecated and replaced by .on()
instead of return false use preventDefault (to avoid unexpected behavior)
i++ only works inside a loop so consider using .each()

$('document').on('click', '.add', function(e) { e.preventDefault(); // do something });

For more help with your code next time please explain what you are trying to achieve and post more of your code to give us the best chance of answering your problem.

score 0 · Answer 3 · answered Apr 16 '13 at 04:00

0

This Code is not best practice.

variable i is not initialized
identical id tag will generated.
scntDiv seem to be undefined variable.

answered Apr 16 '13 at 04:00

caoglish

1,343
3
19
29

var scntDiv = $('.input'); var i = $('.input p').size() + 0; – serenna Apr 16 '13 at 04:02
could you write a jsfiddle – caoglish Apr 16 '13 at 04:24

Aeolun · Accepted Answer · 2013-04-16T04:09:38.613

You close your select element before you write your option tags, by using <select/>. Which should be <select>. That is, remove the extra / at the end of your first tag.

So it becomes like this:

<select>
  <option></option>
  <option></option>
</select>

Instead of this:

<select/>
  <option></option>
  <option></option>
</select>

Of course, add the attributes you used before.

I also recommend taking a look at the rest of the answers.

$('.add').live('click', function()

4 Answers4