Question

I am getting an error message on IE8 & IE7 when calling .dialog().

The error message I am getting from IE console is:

SCRIPT438: Object doesn’t support this property or method.

jquery-1.7.2.min.js, line 2 character 21784

Here is my code:

// Add to cart button clicked
$tablePanel.on('click', '.AddToCartButton', function (e) {
    $('#mdlPopup_backgroundElement').show();


var optionId = +e.target.getAttribute('optionid');       
var categoryId = +e.target.getAttribute('categoryid');       
// Get the product shoptCityId from previous <tr>       
var $baseProdTr = $(e.target).closest('td.info_row').parent().prev();       
var shopCityId = +$baseProdTr.attr('shopcityid');


// For Dev!
if (isNaN(shopCityId)) {        
    alert('Error:\nFailed to get the shopCityId value from the base product <tr>');
    return;           
}

// Close the product <tr> in the table
oTable.fnClose($baseProdTr[0]);

var shopDisplay = $baseProdTr.find('b.shopDisplay').text();

$.post(urlAddToCart, { productOptionId: optionId, shopCityId: shopCityId, shopDisplay: shopDisplay, categoryId: categoryId }, function (result) {
    
    if (result === 'EmptyView') {
        updateCartItemsCount();
      
        $('#mdlPopup_backgroundElement').hide();
        return;
    }
   
    var $input = $(result).filter('#hdnModalProps');           
    var className = $input.attr('classval');           
    var width = $input.attr('widthval');         
    var height = $input.attr('heightval');

    // --------- the error occurred here:  ------------------
        $modalDialog = $(result).dialog({ modal: true, draggable: false, resizable: false, width: width,
            dialogClass: className + 'noTitleDialog'
        });
                
              
    $('#mdlPopup_backgroundElement').hide();
   
});

});

I am using: jquery-ui-1.8.11.min.js

You can see this live here:

http://2send.co.il/Products/%D7%A2%D7%A4%D7%95%D7%9C%D7%94/%D7%A2%D7%A6%D7%99%D7%A6%D7%99%D7%9D

1. Click on the photo.
2. Click on the pink button

Thanks.

Answer 1

Dialog content is coming with \r\n from server, IE8 don’t parse those \r\n and to make DOM elements. so in js, I have added code to remove \r\n from content.

result = result.replace(/\r\n/g, ”).replace(/\s+/g, ‘ ‘);

$modalDialog = $(result).dialog({modal: true, draggable: false, resizable: false, width: width, height: height,
dialogClass: className + ‘ noTitleDialog’
});