Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    RichTextItem not accepting input in IE11

    We use a technique to display a VLayout as a modal form but any RichTextItems within a layout displayed in this way don't accept input in IE11.

    The following code is a minimal test case showing the problem...

    Code:
    isc.VLayout.create({
        members: [
            isc.VLayout.create({
                ID: "componentID",
                visible: false,
                height: 500,
                width: 590,
                visibility: "hidden",
                members: [
                    isc.DynamicForm.create({
                        fields: [{
                            type: "RichTextItem",
                            height: 200,
                            width: 425
                        }]
                    })
                ]
            })
        ]
    });
    var component = window["componentID"];
    
    component.parentElement.removeChild(component);
    
    component.show();
    
    var width = component.getScrollWidth();
    var height = component.getVisibleHeight();
    
    var defaultProps = {
        width: width,
        height: height,
        items: [component]
    }
    
    var w = isc.Window.create(defaultProps);
    w.show();
    In all other browsers the richtextitem displayed can be editted but not in IE11. Any suggestions as to how to get it to work in IE11 would be much appreciated.

    Thanks,

    Dan

    IE11 Version 11.0.996
    v8.3p_2013-11-10/Pro Deployment (built 2013-11-10)

    #2
    Make sure you are using the most recent available patched build when reporting issues (see smartclient.com/builds).

    Comment


      #3
      OK, Version v8.3p_2014-03-06/Pro Deployment (2014-03-06) shows the same effect with this test case - the RichTextItem can't be typed into.

      TIA

      Dan

      Comment


        #4
        We're not reproducing this, in any browser (including IE11) or any SmartClient version.

        What doctype are you using? Are you using an emulation mode? What exact build of IE are you using? If it's not the latest one, please try that.

        Comment


          #5
          Hmm, that's odd. I have <!doctype html> and Edge (Default) emulation.

          IE version is 11.0.9600.16518 which is the latest (I think).

          I tried pasting the above code into hellobutton.js at http://www.smartclient.com/docs/8.3/a/system/reference/SmartClient_Explorer.html#_Featured.Samples_Hello.World and that worked OK so perhaps there is something wrong with my test case. I have the following .html file. The smartclient_v83p_2014-03-06_Pro folder beneath it contains the skins,system,locales and login folders extracted from a downloaded SmartClient_v83p_2014-03-06_Pro.zip

          Code:
          <!doctype html>
          <head>
              <title>Test</title>
              <script type="text/javascript">var isomorphicDir="smartclient_v83p_2014-03-06_Pro/";</script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_core.js?h=r2CB24455DC08F301571D38823D54C9B4E6DDCCD9"></script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_foundation.js?h=rFF5AD0068AC0FDC5BA8D5FDFE060C7C4D247DE9B"></script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_containers.js?h=r723E85024E8ED3318449E92255930A479D62817B"></script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_grids.js?h=r202D969C1030813548BE74D9956270B4ACE79B87"></script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_forms.js?h=r09EDAFB66CCD0C05389B926C24CD3024B57F6454"></script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_databinding.js?h=r079CA53BE0A8C3A4CD2C27FEC96BAAF636FA15D0"></script>
          <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/isc_richtexteditor.js?h=r6B5633B9674047986DDD2CEAF2F64F1A29FDCC3B"></script>
          </head>
          <body>
          
          <script>
          
          isc.VLayout.create({
              members: [
                  isc.VLayout.create({
                      ID: "componentID",
                      visible: false,
                      height: 500,
                      width: 590,
                      visibility: "hidden",
                      members: [
                          isc.DynamicForm.create({
                              fields: [{
                                  type: "RichTextItem",
                                  height: 200,
                                  width: 425
                              }]
                          })
                      ]
                  })
              ]
          });
          var component = window["componentID"];
          
          component.parentElement.removeChild(component);
          
          component.show();
          
          var width = component.getScrollWidth();
          var height = component.getVisibleHeight();
          
          var defaultProps = {
              width: width,
              height: height,
              items: [component]
          }
          
          var w = isc.Window.create(defaultProps);
          w.show();
          
          </script>
          </body>
          </html>

          Comment


            #6
            Framework JS filenames are case-sensitive, so your sample doesn't work at all for us - if we correct the filenames, it works as expected:

            Code:
            <script type="text/javascript">var isomorphicDir="../isomorphic/";</script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_Core.js"></script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_Foundation.js"></script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_Containers.js"></script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_Grids.js"></script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_Forms.js"></script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_DataBinding.js"></script>
            <script type="text/javascript" src="../isomorphic/system/modules/ISC_RichTextEditor.js"></script>

            Comment


              #7
              I'm rather at a loss that you we don't get the same result. Might the isc debug console provide any useful information? I notice that in my IE11 I get extra output...

              10:30:07.054:INFO:Log:initialized
              10:30:07.115:WARN:Log:New Class ID: 'Window' collides with ID of existing object with value '[object Window]'. Existing object will be replaced.
              This conflict would be avoided by disabling ISC Simple Names mode. See documentation for further information.
              10:30:07.196:WARN:Log:New Class ID: 'Selection' collides with ID of existing object with value '[object Selection]'. Existing object will be replaced.
              This conflict would be avoided by disabling ISC Simple Names mode. See documentation for further information.
              10:30:07.361:WARN:Log:New Class ID: 'DataView' collides with ID of existing object with value '
              function DataView() {
              [native code]
              }
              '. Existing object will be replaced.
              This conflict would be avoided by disabling ISC Simple Names mode. See documentation for further information.

              Both IE11 and Chrome show this output...

              10:30:56.993:INFO:Log:initialized
              10:30:57.263:WARN:DynamicForm:isc_DynamicForm_0:[Class RichTextItem] form item defined with no 'name' property - Value will not be saved. To explicitly exclude a form item from the set of values to be saved, set 'shouldSaveValue' to false for this item.
              10:30:57.358:WARN:VLayout:componentID:Adding already drawn widget:isc_DynamicForm_0 to new parent:componentID. Child has been cleared so it can be drawn inside the new parent. This may be a result of autoDraw being enabled for the child.
              10:30:57.408:WARN:VLayout:isc_VLayout_0:Adding already drawn widget:componentID to new parent:isc_VLayout_0. Child has been cleared so it can be drawn inside the new parent. This may be a result of autoDraw being enabled for the child.
              10:30:57.655:INFO:Log:isc.Page is loaded

              Are you seeing the same output in your tests?

              Thanks,

              Dan

              Comment


                #8
                That's not related.

                Did you fix your bootstrap file? If you did, repost it here, assuming that it now works.

                You should also clear your browser caches.

                Comment


                  #9
                  I changed it to be the same as yours but with no difference and I wasn't seeing your case sensitive issues for some reason.

                  I'll clear the browser cache and re-try.

                  Comment


                    #10
                    Clearing browser cache hasn't helped I'm afraid.

                    My test case is now...

                    Code:
                    <!doctype html>
                    <head>
                        <title>Test</title>
                        <script type="text/javascript">var isomorphicDir="smartclient_v83p_2014-03-06_Pro/";</script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_Core.js"></script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_Foundation.js"></script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_Containers.js"></script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_Grids.js"></script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_Forms.js"></script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_DataBinding.js"></script>
                    <script type="text/javascript" src="smartclient_v83p_2014-03-06_Pro/system/modules/ISC_RichTextEditor.js"></script>
                    </head>
                    <body>
                    
                    <script>
                    
                    isc.VLayout.create({
                        members: [
                            isc.VLayout.create({
                                ID: "componentID",
                                visible: false,
                                height: 500,
                                width: 590,
                                visibility: "hidden",
                                members: [
                                    isc.DynamicForm.create({
                                        fields: [{
                                            type: "RichTextItem",
                                            height: 200,
                                            width: 425
                                        }]
                                    })
                                ]
                            })
                        ]
                    });
                    var component = window["componentID"];
                    
                    component.parentElement.removeChild(component);
                    
                    component.show();
                    
                    var width = component.getScrollWidth();
                    var height = component.getVisibleHeight();
                    
                    var defaultProps = {
                        width: width,
                        height: height,
                        items: [component]
                    }
                    
                    var w = isc.Window.create(defaultProps);
                    w.show();
                    
                    </script>
                    </body>
                    </html>

                    Comment


                      #11
                      Ok - just dropping this into an HTML file, we see that everything works as expected.

                      However...

                      It looks like there may be a mis-sizing issue with the inner editor component of the RTE - if you click in the top/left 3rd of the RTE, does it work then?

                      And do you see a really obvious outline sized much smaller than the component as a whole?

                      Comment


                        #12
                        No I'm afraid not - I don't see that and can't click anywhere that gives me an insertion point.

                        Screen shot attached so you can see what I'm seeing.
                        Attached Files

                        Comment


                          #13
                          CTRL-Tab to another window and back again (so that focus switches) and then try clicking in the top-left again

                          Comment


                            #14
                            Actually, scratch that - we see the issue and we're taking a look

                            Comment


                              #15
                              Originally posted by Isomorphic View Post
                              Actually, scratch that - we see the issue and we're taking a look
                              Any update on this yet?

                              TIA

                              Dan

                              Comment

                              Working...
                              X