1. #11
    Ext JS Premium Member neongrau's Avatar
    Join Date
    Mar 2007
    Posts
    249
    Vote Rating
    0
    neongrau is on a distinguished road

      0  

    Default


    strange that the corresponding bugzilla entry was marked as verified fixed since over a year now. when even the attached testcases still show the bug in current versions.

    i reopened that bug and requested verification. but that'll help for long term at best :S

  2. #12
    Sencha User thesilentman's Avatar
    Join Date
    Apr 2007
    Location
    Athens, Greece
    Posts
    232
    Vote Rating
    2
    thesilentman is on a distinguished road

      0  

    Post


    According to the FF people this will be fixed in 3.0 as it depends on other bugfixes that will also appear with 3.0. One could install 3.0 from the trunk to test it.

    Bug report is here:
    https://bugzilla.mozilla.org/show_bug.cgi?id=167801

    EDIT: FYI, the bug report above is worth reading if you are having this issue as there is a lot of discussion with potential workarounds there as well. -Brian
    Last edited by brian.moeskau; 28 Sep 2007 at 2:50 PM. Reason: Additional comment added

  3. #13
    Ext User
    Join Date
    Apr 2007
    Posts
    15
    Vote Rating
    0
    lenzb is on a distinguished road

      0  

    Default


    Quote Originally Posted by nhausig View Post
    Using shim:false only helps in some situations. This bug is a firefox issue and many years old (see https://bugzilla.mozilla.org/show_bug.cgi?id=167801). I've tried many workarounds to no avail. Now there's a solution (see Comment #84). It is somehow ugly. You need a wrapper div around your text input with overflow set to auto and display to none. Then you set display to block after a short delay.

    Code:
    var inputWrapperDiv = ...;
    
    if (YAHOO.ext.util.Browser.isGecko) {
      inputWrapperDiv.style.display   = 'none';
      inputWrapperDiv.style.overflow  = 'auto';
      setTimeout(function() {inputWrapperDiv.style.display = 'block';}, 10);
    }
    If setting overflow to auto is resulting in scrollbars (resizing elements in wrapper div), you have to give the wrapper div some extra padding.
    I ran into this same problem and came up with a similar solution to what nhausig described. In my case, I found that a 10ms delay often wasn't sufficient. I found cases where the cursor wouldn't appear even after 300ms. I use a timeout of 500ms (I know, half a second is a long time), and haven't had this problem since.

  4. #14
    Ext User
    Join Date
    Jun 2007
    Posts
    75
    Vote Rating
    0
    crafter is on a distinguished road

      0  

    Default


    I'm experiencing a similar problem on Firefox 1.5

    My situation is such:
    I have a folder that receives a dialogue markup from a server
    Code:
    <div id='author_dialoge'>
       <!-- Place holder for server generated detail form -->
    </div>
    The request to the server populates the div, which include a normal form:
    PHP Code:
    <h2>Enter author Details</h2>

    <form name="authordetails" id="authordetails" method="POST" action="<?= $action_url?>"  onsubmit="return saveAuthorForm(<?= $id?>);">
    <input type='hidden' name='id' id='id' value='<?= $id?>' >

          <!-- The dialog is created from existing markup.
          The inline styles just hide it until it created and should be in a stylesheet -->
          <div id="author-dlg" style="visibility:hidden;position:absolute;top:0px;width;">
          <div style="position:fixed">
             <div class="x-dlg-hd">Contact Detaiils
             </div>
             <div class="x-dlg-bd">
             <!--            Auto create tab 1 -->
                <div class="x-dlg-tab" title="Hello World 1">
                   <!-- Nested "inner-tab" to safely add padding -->
                   <div class="inner-tab">
                   
                   <div class="oneCol">
                      <label for="description" ><span>Id (Internal):</span>
                         <?= isset($id)?$id:''?></label>
                   </div>
                   <div class="twoCols">
                      <label for="title" ><span>Title:</span>
                         <input type='text' name='title' id='title' value='<?= $title?>' /></label>
                      <label for="firstname" ><span>Firstname:</span>
                         <input type='text' name='firstname' id='firstname' value='<?= $firstname?>' /></label>
                      <label for="surname" ><span>Surname:</span>
                         <input type='text' name='surname' id='surname' value='<?= $surname?>' /></label>
                      <label for="email" ><span>email:</span>
                         <input type='text' name='email' id='email' value='<?= $email?>' /></label>

                      <label for="byline" ><span>Byline :</span>
                         <textarea cols=35 rows=7 NAME='byline' id='byline' ><?= $byline?></textarea></label>
                      <label for="pic_url" ><span>Picture URL :</span>
                         <input type='text' name='pic_url' id='pic_url' value='<?= $pic_url?>' /></label>
                      <label for="homepage" ><span>Home Page URL:</span>
                         <input type='text' name='homepage' id='homepage' value='<?= $homepage?>' /></label>

                      <label for="designation" ><span>Designation :</span>
                         <input type='text' name='designation' id='designation' value='<?= $designation?>' /></label>
                      <label for="homepage" ><span>Home Page URL:</span>
                         <input type='text' name='homepage' id='homepage' value='<?= $homepage?>' /></label>
                   </div>
                   </div>
                </div>


                <!-- Auto create tab 2 -->
                <div class="x-dlg-tab" title="HTML Editor">
                   <!-- Nested "inner-tab" to safely add padding -->
                   <div class="inner-tab">
                      <div class="twoCols">
                      <label for="login" ><span>Login Name:</span>
                         <input type='text' name='login' id='login' value='<?= $login?>' /></label>
                      <label for="password" ><span>Password:</span>
                         <input type='password' name='password' id='password' value='<?= $password?>' /></label>
                      <label for="active" ><span>Active? :</span>
                         <input type='checkbox' name='active' id='active' value='<?= $active?>' /></label>
                      <label for="admin_user" ><span>Privileged User?:</span>
                         <input type='checkbox' name='admin_user' id='admin_user' value='<?= $admin_user?>' /></label>
                      <label for="comments" ><span>Comments :</span>
                         <textarea cols=35 rows=7 NAME='comments' id='comments' ><?= $comments?></textarea></label>
                      </div>
                   </div>
                </div>
             </div>

          </div>
          </div>


    <input type="submit" name="Submit" value="Save">
    <input type="reset" name="resetForm" value="Clear Form">

    </form>
    I then invoke the dialogue:

    Code:
    <script>
    
       AuthorDialog = function(){
       // everything in this space is private and only accessible in the WysiWyg block
    
       // define some private variables
             var dialog, showBtn;
             var  sourcediv;
    
       // return a public interface
       return {
    
          showDialog : function(){
             //           showBtn = Ext.get('show-dialog-btn');
       
             if(!dialog){ // lazy initialize the dialog and only create it once
                   dialog = new Ext.BasicDialog("author-dlg", {
                      autoTabs:true,
                      width:600,
                      height:400,
                      shadow:true,
                      minWidth:300,
                      minHeight:250,
                      proxyDrag: true
                   });
                   dialog.addKeyListener(27, dialog.hide, dialog);
                //              dialog.addButton('Submit', dialog.hide, dialog).disable();
                   dialog.addButton('Submit',
                                  function() {
                   //                                  setHTMLEditorValue();
                                     dialog.hide();
                                  },
                                     dialog);                  
                   dialog.addButton('Close', dialog.hide, dialog);      
             }         
             dialog.show();
             }
          };
       };
    
           AuthorDialog.showDialog();
    </script>
    This works fine, and the dialogue is displayed.

    Howvere, certain fields dont seem to have focus.

    I notice that sometimes using the right mouse button on a field will restore focus, but I can't train users to do this!

    I I render the page without loading Ext, then I don't experience this problem, so I'm not convinced Firefox is the lone culprit here.

    Can anyone suggest what I could try to solve this.

  5. #15
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    17
    jack.slocum will become famous soon enough jack.slocum will become famous soon enough

      0  

    Default


    crafter, it is definitely a Firefox bug. Please give the forum some searches. There is a link to the Mozilla bug tracker with the bug (years old and still not fixed) and I have provided several workaround.
    Jack Slocum
    Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum
    jack@extjs.com

  6. #16
    Ext JS Premium Member prophet's Avatar
    Join Date
    Mar 2007
    Location
    Greenwich, CT
    Posts
    187
    Vote Rating
    0
    prophet is on a distinguished road

      0  

    Default


    Quote Originally Posted by Jonathan Feinberg View Post
    Here's a workaround that works for me, and gives you a nice, fat, blinking cursor in the text area:

    Code:
    Ext.MessageBox.getDialog().on("show", function(d) {
        var div = Ext.get(d.el);
        div.setStyle("overflow", "auto");
        var text = div.select(".ext-mb-textarea", true);
        if (!text.item(0))
            text = div.select(".ext-mb-text", true);
        if (text.item(0))
            text.item(0).dom.select();
    });
    This worked for me too! Thanks Jonathan Feinberg!
    Brad Baumann

  7. #17
    Ext User
    Join Date
    Mar 2007
    Location
    Boston
    Posts
    349
    Vote Rating
    0
    sjivan is on a distinguished road

      0  

    Default


    Was anything done in Ext to fix this? I see that the cursor is now appearing in the "Prompt" dialog example of Ext in Firefox. In some of my 1.1.1 examples however I still don't see a cursor. If I remember correctly, the prompt did previously did not show a cursor in FF.

    Before I investigate further I am curious to know if some change was made in Ext to handle this?

    Thanks,
    Sanjiv

  8. #18
    Sencha - Community Support Team jsakalos's Avatar
    Join Date
    Apr 2007
    Location
    Slovakia
    Posts
    27,538
    Vote Rating
    380
    jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future

      0  

    Default


    Yes, there are some workarounds in Ext. Nevertheless, it's bug so it sometimes behaves unpredictable way. Hopefully they'll fix it in FF 3.
    Jozef Sakalos, aka Saki

    Education, extensions and services for developers at new http://extjs.eu
    News: Grid Search Plugin, ExtJS 5 Complex Data Binding using MVVM


  9. #19
    Ext User
    Join Date
    Apr 2007
    Posts
    14
    Vote Rating
    0
    Alan Knowles is on a distinguished road

      0  

    Default Simple fix.

    Simple fix.


    This works for me.. - simple fix

    Code:
     .x-dlg {
          position: fixed;
          position:expression("absolute");
        }

  10. #20
    Ext User hunkybill's Avatar
    Join Date
    Mar 2007
    Location
    Montreal
    Posts
    67
    Vote Rating
    0
    hunkybill is on a distinguished road

      0  

    Default


    Quote Originally Posted by Alan Knowles View Post
    This works for me.. - simple fix

    Code:
     .x-dlg {
          position: fixed;
          position:expression("absolute");
        }
    OMG: Wow. That did work. At one time or another, I have implemented each and every workaround to this problem. Depending on the alignments of the Moon and my ass, the workarounds would behave with varying degrees of success.. this one is so simple...can you explain how you derived this little ditty?

Similar Threads

  1. "FireFox2 kills cursor" and text-select in toolbar
    By brian in forum Ext 1.x: Bugs
    Replies: 8
    Last Post: 7 Jun 2007, 12:12 AM
  2. TextEditor input type text
    By alex1er in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 28 Jan 2007, 7:59 AM
  3. BasicDialog problem with Firefox
    By chris in forum Ext 1.x: Bugs
    Replies: 4
    Last Post: 18 Nov 2006, 12:21 PM
  4. Style attribute of text input field for ygrid-page-number
    By maurits in forum Ext 1.x: Help & Discussion
    Replies: 3
    Last Post: 2 Oct 2006, 12:51 AM

Thread Participants: 20