ASP.NET 3.5 and above only

HTML Editor - Knowledge Base

« Back to Knowledge Base list

Disable fields in popup conditionally

Q:

When we right click on any image, and then click on Image Properties context menu, Image Properties dialog gets displayed. In this dialog, we want to disable Height and Width text boxes, so that user can not resize the image.
But we want to disable these two fields conditionally. If an image has usemap attribute, then disable these two fields, otherwise keep these fields enabled.
 
Is there any workaround for it?

A:

You can do it in client-side:

<obout:Editor runat="server" Id="editor" Height="500px"Width="100%">
    <PopupHolder OnClientPopupStateChanged="popupStateChanged" />
< /obout:Editor>
...
<script type="text/JavaScript">
function popupStateChanged(sender, args) {
    // some popup is opened
    if (args.get_state() == Obout.Ajax.UI.HTMLEditor.PopupStateType.Open) {
       // We need 'Image properties' popup only
       if (args.get_name().split(",")[0] == "Obout.Ajax.UI.HTMLEditor.Popups.ImageProperties") {
          // find the popup component
          var popup = $find(sender.findPopup(args.get_name()).clientID);
          var img = popup._obj; // target image
          var widthField = popup._widthField; // 'width' textbox
          var heightField = popup._heightField; // 'height' textbox
          var scaleField = popup._scaleField; // 'scale' checkbox
          var usemap = img.getAttribute("usemap"); // get the 'usemap' attribute
          if (usemap && usemap.length > 0) {
             // prevent image size editing
             widthField.disabled = true;
             widthField.readOnly = true;
             heightField.disabled = true;
             heightField.readOnly = true;
             scaleField.disabled = true;
          } else { // no 'usemap' attribute
             // allow image size editing
             widthField.disabled = false;
             widthField.readOnly = false;
             heightField.disabled = false;
             heightField.readOnly = false;
             scaleField.disabled = false;
          }
       }
    }
}
</script>

"We are really liking your grid.It is really a great control."

Nauman Cheema
DHS

Random testimonial   All testimonials

Products Downloads