Show and reset <select> with the jquery checkbox

Asked

Viewed 71 times

2

In the example code attached, the item value is multiplied by the value of the respective select and displays the subtotal and total.

My question (of beginner), is how to hide and remove the selectlist from the account when the respective checkbox is unchecked, ie when checking the checkbox, the respective selectlist appears always starting at the first item in the list(1 unit).

I even managed to make it work without Jquery but it looked like a "Frankenstein" Thanks in advance, everyone who can help.

Follow the incomplete example, with jquery: https://jsfiddle.net/hLapmkq9/

jquery

  • You only want it to disappear when the checkbox is selected, or only when the user selects an item from the selectlist.

  • Why not lock your select until the checkbox is selected?

  • Selecting the first checkbox shows the first selectlist and adds it to the account

  • I guess I got a little confused and edited out the original question @Marlon

  • @Danilofagundes takes a look at what you need: https://jsfiddle.net/mtsys/hLapmkq9/1/

1 answer

1


What you need is to find a logic to know which input and select work together. In this case it seems to me that the common element is the tr, or both share the same line.

You can do it like this:

$('table input:checked').each(function() {
    var tr = $(this).closest('tr');
    var qty = tr.find('.qty').val();
    var price = $(this).val();
    var amount = (qty * price) || 0;
    sum += amount;
    tr.find('.amount').text(amount);
});

jsFiddle: https://jsfiddle.net/8uk440do/

Notice that I use as a starting point only inputs selected with $('table input:checked'). Hence the this within the function will be the input.

  • Good afternoon to you. Almost there: With your hint I got to this point, just make the reset of the selectlist work: https://jsfiddle.net/8uk440do/1/

  • I made a mistake on line 8 of the JS ?

  • @Danilofagundes ah, would you like to hide select too? ok, in that case it would be better: https://jsfiddle.net/8uk440do/2/ <- that’s what you’re looking for?

  • following the logic of its last code, how to "reset" the selectlist always to the first value, when uncheck the respective checkbox? Ex: "('selectedIndex',0)"

  • I got the result and reset of the selectlist using the previous code: https://jsfiddle.net/8uk440do/3/ . Thanks for the help. ;)

  • @Danilofagundes in this case is enough if (!this.checked) select.prop('selectedIndex', 0); https://jsfiddle.net/8uk440do/8/

Show 1 more comment

Browser other questions tagged jquery

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