Handle Position in ResizableControlExtender RSS

• • Reply
  

  yzidell

  Member

  620 Points

  422 Posts

  Handle Position in ResizableControlExtender

  Jul 15, 2007 04:13 PM|LINK

  I have ResizableControlExtender together with a ModalPopupExtender to create a moveable

  and resizable popup. The problem is that the handle image first appears in upper left hand corner when

  it is supposed to appear in lower right hand corner. When I click it jumps to its correct position in the

  lower right hand corner. The problem is when it first appears, the handle is on wrong spot.

  Source Code:

  <ajaxToolkit:ResizableControlExtender ID="RCEPageHelp" runat="server"

  TargetControlID="pnlPageHelp" ResizableCssClass="resizingText"

  HandleOffsetX=3 HandleOffsetY=3 HandleCssClass="handleText" />

  Your help is greatly appreciated.

  Thank you for help.

• • Reply
  

  jmmobley

  Member

  2 Points

  2 Posts

  Re: Handle Position in ResizableControlExtender

  Oct 24, 2007 10:28 PM|LINK

  Did anyone ever find out the solution to this problem? I'm having the same issue.

• • Reply
  

  jymarkusg

  Member

  9 Points

  26 Posts

  Re: Handle Position in ResizableControlExtender

  Oct 07, 2008 08:05 AM|LINK

  I have the same problem... Did you find any solution? I have already tried to use javascript (simulate a click when loading the popup) but I didn't get it working...

  Thanks
  Markus

• • Reply
  

  philosophist...

  Member

  2 Points

  1 Post

  Re: Handle Position in ResizableControlExtender

  Oct 30, 2008 10:54 AM|LINK

  I have the exact same problem.

  Is it a bug on the ajaxcontroltoolkit?

• • Reply
  

  jymarkusg

  Member

  9 Points

  26 Posts

  Re: Handle Position in ResizableControlExtender

  Oct 30, 2008 11:38 AM|LINK

  Yes, it is a problem with the toolkit - perhaps it'll be solved in future releases!

  But there is a workaround. In your page add the following javascript function:

  function showPopComment(id, id2) {
              var popupControl = $find(id);
              popupControl.show();
  
  
              var resizeControl = $find(id2);
              resizeControl._resizeControl(0, 0, 0, 0);
              resizeControl._rememberSize();
          }

  In the ASP add a BehaviourId to to elements (fixed value or dynamic Ids in my case when you are in a gridview):

  <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" 
                                     TargetControlID="fullComment" PopupControlID="popComment" Drag="true"
                                     BackgroundCssClass="modalBackground" PopupDragHandleControlID="outerPopup"
                                     CancelControlID="closeComment" BehaviorID='<%# Eval("Oid") %>' /> 

    

  <ajaxToolkit:ResizableControlExtender ID="ResizableControlExtender2" runat="server" 
                                      TargetControlID="popComment" BehaviorID='<%# Eval("vId") %>'  
                                      HandleCssClass="handlePopup"
                                      MinimumWidth="600" MinimumHeight="350" 
                                      OnClientResizing="OnClientResizing"
                                      HandleOffsetX="3" HandleOffsetY="3"
                                      ResizableCssClass="resizePopup" Enabled="true" />

    

  After this you have to call the popup manually via Javascript like:

  <div id="fullComment" runat="server" class="viewFullComment" >
                               <a href="#" onclick="javascript:showPopComment('<%# Eval("Oid") %>', '<%# Eval("vId") %>');" ><u>More...</u></a>
                               
                      </div>

  Now it should be ok!

  Greetings
  Markus

  • Edited by jymarkusg on Oct 30, 2008 11:40 AM
• • Reply
  

  rabid lemmin...

  Member

  14 Points

  3 Posts

  Re: Handle Position in ResizableControlExtender

  Dec 11, 2008 08:04 AM|LINK

  I seemed to have found a fix after hours of searching and trying to fix it myself. I could not get anything else to work but this seems to work perfectly. I found this work...if you use a button and server side code to show you popup you don’t need to reset  var blnIsFirstLoad = true;but if you use javascript to show the popup then you will need to on the popup close button reset this value back to true. i.e.

  <img  src="Close_12x12.gif" title="Click to close this popup" onclick="JavaScript:$find('mpeAutoTransfer').hide();blnIsFirstLoad = true;" />

  My ajax tags

    <cc1:ModalPopupExtender ID="mpeAutoTransfer" RepositionMode="RepositionOnWindowResizeAndScroll"
              runat="server" BackgroundCssClass="modalBackground" PopupControlID="pnlAutoTransfer"
              OkControlID="btnAutoTransferOK" Drag="true"  PopupDragHandleControlID="imgAutoTransferDragHandle"
              TargetControlID="btnDummyAutoTransferShow">
          </cc1:ModalPopupExtender>
          <cc1:ResizableControlExtender ID="ResizableControlExtender1" runat="server" BehaviorID="ResizableControlBehavior1"
              TargetControlID="pnlAutoTransfer" ResizableCssClass="resizingImage" HandleCssClass="handleImage"
              MinimumWidth="900" MinimumHeight="700" HandleOffsetX="-3" HandleOffsetY="-3"
              MaximumWidth="1000" MaximumHeight="1000" OnClientResizing="OnClientResizing" />

  The script

  <script type="text/javascript" language="javascript">
      var blnIsFirstLoad = true;
      function OnClientResizing(sender, eventArgs){
          var rcp = $find('ResizableControlBehavior1');
          if(blnIsFirstLoad == true){
              rcp._handle.style.left ='887';
              rcp._handle.style.top ='687';
              blnIsFirstLoad = false;
          }
          return false;
      }
     </script>
   
  simply edit the rcp._handle.style.left ='887'; and rcp._handle.style.top ='687'; so that the handle appears in the correct postion for you div
   

  • Edited by rabid lemming on Dec 11, 2008 08:09 AM
  • Edited by rabid lemming on Dec 11, 2008 08:10 AM
  • Edited by rabid lemming on Dec 11, 2008 08:12 AM
  • Edited by rabid lemming on Dec 11, 2008 08:12 AM