onclick attribute can't be selected in jquery and not visible in inspector, but working

Question

I'm working on a magento project with a plugin changes the onclick attribute on the (document).ready(). I tried to access this attribute using jquery to update it after a user action but it returns undefined. And I've noticed that the onclick attribute is NOT visible in the inspector but visible in the page source accessed by view page sourceorCtrl + u.

in inspector the targeted button looks like

<button type="button" id="addtocart_btn_5" title="Add to cart" class="button btn-cart btn-cart-with-qty">
    <span>Add to cart<span>
</button>

in the page source view it looks like:

<button type="button" id="addtocart_btn_5" title="Add to cart" class="button btn-cart btn-cart-with-qty" 
        onclick="setLocation('http://mysite.local/eg_ar/checkout/cart/add/uenc/aHR0cDovL2hhaXJidXJzdGFyYWJpYS5sb2NhbC9lZ19hci8,/product/5/form_key/lqUtnptjQU7Cn7E1/qty/1/')">
    <span>Add to cart</span>
</button>

this button is correctly accessed via the variable btn and when i use console.log(btn.attr("onclick")); it returns undefined but with attribute like id it returns the id correctly.

NOTE: the button is working very well. but I can't edit it.

Update: as per @Saptal question I've to show more code. in the html part I've this block

<div class="add-to-cart">
    <form id="product_addtocart_form_15">
            <span class="custom-counter">
            <input min="1" name="qty" id="qty" maxlength="2" value="1" title="qty" class="qty qty-updating" type="number"><div class="custom-counter-nav"><div class="custom-counter-button custom-counter-up">+</div><div class="custom-counter-button custom-counter-down">-</div></div>
        </span>
        <button type="button" id="addtocart_btn_15" title="Add to cart" class="button btn-cart btn-cart-with-qty"><span>Add to cart</span></button>

   </form>

</div>

and in js I do that

<script>
    jQuery('.qty-updating').each(function(){
        var qty = jQuery(this);

        qty.on('change', function(e){
            alert('here');
            var btn = qty.parent().siblings('.btn-cart');
            console.log(btn.attr("onclick"));
        });

    });
</script>

thanks in advance

the same result `let qty` & `let qty , let btn` each in separate try — M.Elwan, Apr 03 '17 at 10:17

score 1 · Answer 1 · answered Apr 22 '17 at 15:28

1

click event is binded to the button and the onclick attribute isn't set explicitly as a html attribute on the button so,

btn.attr('onclick')

will return undefined and to solve this problem you need to off (unbind) the current click event and on (bind) the new click event as following:

btn.off('click');
btn.on('click', function() {
    yourFunction();
});

hope this helps :)

answered Apr 22 '17 at 15:28

Mostafa Abdelghffar

21
2

I want to update the url in `onClick` and not to overwrite it. it contains a generated url that can't be regenerated `setLocation('http://mysite.local/sa_ar/checkout/cart/add/uenc/aHR0cDovL2hhaXJidXJzdGFyYWJpYS5sb2NhbC9zYV9hci8,/product/5/form_key/M3h1IpZ4WmxTNVbX/qty/1/` – M.Elwan Apr 23 '17 at 12:48
aha .. then you may need to check if you can get the attached click event without the way of accessing the onclick attribute. please check this question [Can I find events bound on an element with jQuery?](http://stackoverflow.com/questions/2008592/can-i-find-events-bound-on-an-element-with-jquery) – Mostafa Abdelghffar Apr 25 '17 at 00:28

score -1 · Answer 2 · answered Apr 03 '17 at 10:03

-1

In your issue description you said you use a plugin which changes the onclick attribute. It seems that there is a JS code which actually deletes that attribute. Can you disable that plugin just to make sure the onclick attribute is NOT deleted?

answered Apr 03 '17 at 10:03

Manuel Cheța

480
2
10

how it can be deleted ? it's working and visible in the source. – M.Elwan Apr 03 '17 at 10:05
so you say that the button's onclick event is working even not displaying in inspector?? is it right?? @M.Elwan – Abhishek Mishra Apr 03 '17 at 10:08
@AbhishekMishra exactly, yes – M.Elwan Apr 03 '17 at 10:09

onclick attribute can't be selected in jquery and not visible in inspector, but working

2 Answers2