RadEditor Cell Properties removing table property background image

Progress® Telerik® UI for ASP.NET AJAX Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Completed

Last Updated: 01 May 2018 14:10 by ADMIN

ADMIN

Rumen

Created on: 03 Apr 2018 15:42

Category: Editor

Type: Bug Report

RadEditor Cell Properties removing table property background image

This behavior can be observed in your production demo page of the RadEditor.

http://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx

Reproduction Steps:

1. Scroll to the table under "Attractions"

2. Right click and select "Table Properties"

3. Select the "Image Manager" next to the "Back Image" textbox

4. Select anyone of your images,  I have reproduced with any of the images select "beach.jpg"

5. Click OK.  The image is now visible in the table.

6. Right click on nay cell in the table and select "Cell Properties"

7. You can make a change, or not to the cell properties, and click "OK" button at the bottom.

8. You will now see that the background image is no longer present on the table.

If you try step 8 again, and click on the "Table Properties" tab of the Table Wizard, you will see that there is no value in the "Back Image", so the "OK" is submitting the blank value.

1 comment

ADMIN

Rumen

Posted on: 01 May 2018 14:09

After research it appeared that this is a missing functionality. 
The issue does not happen locally, because the background image path inside the Table Properties dialog is cached. In reality on a production site, its gets cleared and that's why the background disappears once one alters the Cell Properties settings.

I managed to solve the issue by modifying the TableProperties.ascx external dialog file by adding the following check in the _loadData function, which explicitly sets always the background image to the table:

if (this._imageCaller) {
    var imagePath = this._tableToModify.style.backgroundImage;
    imagePath = imagePath.replace('url(', '').replace(')', '').replace(/\"/gi, "");
    this._imageCaller.set_value(imagePath);
}


i.e.

_loadData: function () {
    //clear dialog data because the page is not reloaded each time the dialog is opened!
    this._currentRowSpan = 1;
    this._currentColSpan = 1;
    this._selectedCell = null;
    this._selectedCellIndex = -1;
    this._victimColumns = new Array();
    this._victimRows = new Array();
     
     
 
    if (this._imageCaller) {
        var imagePath = this._tableToModify.style.backgroundImage;
        imagePath = imagePath.replace('url(', '').replace(')', '').replace(/\"/gi, "");
        this._imageCaller.set_value(imagePath);
    }
 
    //clear the table preview control as well      
    this._tablePreviewControl.deSelectAllCells();
    if (this._tableToModify) {
        this._rowsCount = this._tableToModify.rows.length;
    }
    this._tablePreviewControl._updateTable(this._tableToModify, this._selectedCell);
    this._checkButtonAvailability();
},