javascript - Jquery closest does not work? -
i'm trying build general function get's called 4 different checkboxes. when checkbox checked should remove attribute disabled button near checkbox.
my buttons have diffrent classes this
button 1: class="button primary pie list-buy-button list_buy_button_1903"
button 2: class="button primary pie list-buy-button list_buy_button_1901"
button 3: class="button primary pie list-buy-button list_buy_button_1899"
button 4: class="button primary pie list-buy-button list_buy_button_1897"
first bind event checkboxes
$(".avtalsbox").each(function() { $(this).click(function() { chbclickeventhandler(this); }); }); then handle function.. encounter problem
i have tried many solutions noone works?
function chbclickeventhandler(thebox) { if (thebox.checked) { //solution 1 var button = $(thebox).closest("[class*='buy_button']"); $(button).removeattr("disabled"); //solution 2 var button = $(thebox).parent().children("[class*='buy_button']"); $(button ).removeattr("disabled"); } } this how html looks like
<div class="buyonly boxhighlight varmepaket1"> <div width="100%" style="float:right;"> <!---köpknapp---> <form class="product_form" action="/shoppingcart/increase_product_count/" method="post"> <input type="hidden" name="quantity" value="1" id="quantity"> <span class="button-container pie"> <!-- input want remove disabled aswell add --> <input class="button primary pie list-buy-button list_buy_button_1903" type="submit" value="beställ idag!" disabled=""> </span> <!---crap---> <input type="hidden" name="product_id" value="1903"> <input type="hidden" name="article_number" value="varmepaket2"> </form> <!---köpknapp end---> </div> <div width="" style="float:right;"> <a href="#" onclick="eb_klarna_sum=14990; $('body').find('#klarna_payment').click(); return false;"> <img class="symbol" src="/layouts/focus/klarna_symbol.png"> dela upp betalningen från xxx kr/mån</a></div> <div style="float:left;"><input type="checkbox" class="avtalsbox" name="godkannavtalet" value="varmepaket1">jag godkänner avtalet!</div> </div>
your usage of closest incorrect try way: closest parent or provided there match in selector. here use closest parent div class .buyonly , find button inside that.
$(".avtalsbox").change(chbclickeventhandler); function chbclickeventhandler() { if (this.checked) { //solution 1 var button = $(this).closest(".buyonly").find("[class*='buy_button']"); $(button).prop("disabled", false); } } if looking toggle button can do:
$(".avtalsbox").change(chbclickeventhandler); function chbclickeventhandler() { $(this) .closest(".buyonly") .find("[class*='buy_button']") .prop("disabled", !this.checked); }
Comments
Post a Comment