Question

i'm trying to add on click event inside the jquery onclick event. I'm using the following code. But it is not working. i'm having online shopping site. I'm trying to add quick view of the product. Now the issue is ajax add-to-cart button is not working in jquery dialog. The problem is i could not pass the product id into add-to-cart button. The variable a is not working.How can i pass this into add-to-cart onclick function.

 $(function () {
    debugger;
    $("#dialog").dialog({

        modal:true,
        autoOpen: false,
        draggable:true,
        resizable: false,
        width: "auto"

    });

    $(".dialogify").bind("click", function(e) {
        e.preventDefault();
        var a=$(this).next().find('img').attr('buttons');
        $("#dialog").dialog('option', 'title', $(this).next().find('img').attr('title'));      
        $("#dialog").html("<img src='" + $(this).next().find('img').attr('src') + "' width='150' + height='150'>"+"<label>"+"<br/>"+ $(this).next().find('img').attr('price')+"<br/>"+"</label>"+"<label>"+$(this).next().find('img').attr('desc')+"</label>"+"<br />"+"<input type='button' value='@(Model.ProductPrice.AvailableForPreOrder ? T("ShoppingCart.PreOrder") : T("ShoppingCart.AddToCart"))' class='button-2 product-box-add-to-cart-button' onclick= (a)/>")
        $("#accordion").accordion();
        $("#dialog").dialog("option", "position", {

            modal:"true",
            my: "center",
            at: "center",
            title:"title",
            of: window

        });
        if ($("#dialog").dialog("isOpen") == false) {
            $("#dialog").dialog("open");

        }
    });
});

.cshtml

  <div class="buttons" id="but">
    @if (!Model.ProductPrice.DisableBuyButton)
        {
            <input type="button" value="@(Model.ProductPrice.AvailableForPreOrder ? T("ShoppingCart.PreOrder") : T("ShoppingCart.AddToCart"))" class="button-2 product-box-add-to-cart-button" onclick="AjaxCart.addproducttocart('@addtocartlink    ');return false;" />
        }
   </div>
Was it helpful?

Solution

I take it you are trying to bind a click event to the button in the following line:

$("#dialog").html("<img src='" + $(this).next().find('img').attr('src') + "' width='150' + height='150'>"+"<label>"+"<br/>"+ $(this).next().find('img').attr('price')+"<br/>"+"</label>"+"<label>"+$(this).next().find('img').attr('desc')+"</label>"+"<br />"+"<input type='button' value='@(Model.ProductPrice.AvailableForPreOrder ? T("ShoppingCart.PreOrder") : T("ShoppingCart.AddToCart"))' class='button-2 product-box-add-to-cart-button' onclick= (a)/>");

You can do this by after the line that inserts the button into the dom (ie anywhere below the above line):

$("#dialog").find('.product-box-add-to-cart-button').on('click', function() {});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top