Running javascript on a pop up window

Question

I am working in PHP and I have an add item button on a page that when the user clicks will pop up a window using the tinybox.js script. The pop up window is a PHP page itself that retrieves some data from a db. On this pop up page I have some JavaScript with a + and - button so that the user can change a quantity. This works perfectly when loading the page directly but it seems that the JavaScript will not run when the page is a pop up.

Can anyone please tell me what I need to do to get the code to work on the pop up.

Here is the javascript for the change quantity buttons:

$(".ddd").on("click", function () {

    var $button = $(this),
        $input = $button.closest('.set-quantity').find("input.quantity-input");
    var oldValue = $input.val(),
        newVal;

    if ($.trim($button.text()) == "+") {
        newVal = parseFloat(oldValue) + 1;
    } else {
        // Don't allow decrementing below zero
        if (oldValue > 1) {
            newVal = parseFloat(oldValue) - 1;
        } else {
            newVal = 1;
        }
    }

    $input.val(newVal);

});

score 1 · Accepted Answer · edited May 23 '17 at 11:58

1

Try this instead:

$(document).on("click", ".ddd", function () {

This will ensure your event is fired for elements not in the DOM when the event binding occurs. Hard to answer without more info regarding the state of the DOM at the point of this JS running (Some would help you here regarding this "pop-up")

Taken from here: LINK

edited May 23 '17 at 11:58

Community

1
1

answered Aug 09 '15 at 07:54

Dan Belden

1,199
1
9
20

Thanks a lot Dan, this did it ! Much appreciated. – Jarrow Aug 09 '15 at 09:17

score 0 · Answer 2 · answered Aug 09 '15 at 07:58

You have to use body before .ddd in your jquery. Updated code is

$("body .ddd").on("click", function () {

    var $button = $(this),
        $input = $button.closest('.set-quantity').find("input.quantity-input");
    var oldValue = $input.val(),
        newVal;

    if ($.trim($button.text()) == "+") {
        newVal = parseFloat(oldValue) + 1;
    } else {
        // Don't allow decrementing below zero
        if (oldValue > 1) {
            newVal = parseFloat(oldValue) - 1;
        } else {
            newVal = 1;
        }
    }

    $input.val(newVal);

});

Running javascript on a pop up window

2 Answers2