Results 1 to 3 of 3

Thread: Scroll Bar is Moving Up And Down

  1. #1
    Sencha User
    Join Date
    Nov 2012
    Location
    INDIA, Hyderabad
    Posts
    23
    Answers
    2
    Vote Rating
    0
      0  

    Default Scroll Bar is Moving Up And Down

    Hi

    I Have design a form with ExtJs.

    My Form contains more than 15 fields, but i have restricted the form
    height by specified value.(in Pixel).

    The problem is:
    when i fill the data in the text area which is located at bottom of the form, the scroll bar is jumps to Up And Down,

    Any Help would be appreciated..
    Thank in Adv...
    Ravi Maroju

  2. #2
    Sencha User friend's Avatar
    Join Date
    Apr 2011
    Posts
    895
    Answers
    106
    Vote Rating
    27
      0  

    Default

    This sounds like a simple layout issue. Can you please post a code sample which shows the complete layout of your form and its parent container?

  3. #3
    Sencha User
    Join Date
    Nov 2012
    Location
    INDIA, Hyderabad
    Posts
    23
    Answers
    2
    Vote Rating
    0
      0  

    Default

    Thank You friend,

    Here am sending code snippet ....

    jsp:
    <td width="86%">
    <div id="mcs4_container" style="width: 99%;">
    <div>
    <div class="container" >
    <div id="MainForm">

    </div>
    </div>
    <div class="dragger_container">
    <div class="dragger"></div>
    </div>
    </div>
    <a href="#" class="scrollUpBtn"></a> <a href="#" class="scrollDownBtn"></a>
    </div>
    &nbsp;
    </td>


    css container defination:

    @charset "utf-8";

    #mcs4_container{ border: 0px solid red; height:450px; padding:0 0px; }
    #mcs4_container .customScrollBox{height:100%; overflow:hidden;border: 0px solid green;}
    #mcs4_container .customScrollBox .container{position:relative;width:99%; top:0; float:left;border: 0px solid green; }
    #mcs4_container .customScrollBox .content{clear:both;border: 0px solid orange; }
    #mcs4_container .customScrollBox .content p{padding:0px 0px; margin:5px 0; border: 2px solid green; }
    #mcs4_container .dragger_container{position:relative; width:2px; height:430px; float:left; margin:0px 4px 0 3px; cursor:pointer;background:transparent;}
    #mcs4_container .dragger{
    position:absolute;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    margin-left:-5px;
    border-top: 10px solid #127adb;
    overflow:hidden; cursor:pointer;
    }
    #mcs4_container .dragger_pressed{
    position:absolute;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    margin-left:-5px;
    border-top: 10px solid #127adb;
    overflow:hidden; cursor-resize;}


    Extjs code:

    xtype: 'form',
    bodyPadding: '5 5 5',
    width: 945,
    height: 430
    //autoHeight:true,
    //autoScroll:true,
    fieldDefaults: {
    labelAlign: 'top',
    msgTarget: 'side'
    },
    .............
    ...........

    this form is render to MainForm div id
    Ravi Maroju

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •