Bug: can't edit RichTextItem after form.setCanEdit(true)

[Oleg]

1. SNAPSHOT_v9.0d_2013-02-28/LGPL Development Only (built 2013-02-28)
2. browser(s): IE 8, FF 10.0.2


RichTextItem and other FormItems located on DynamicForm. The form is assigned to Datasource. By default form.setCanEdit(false)

When I add new record and do

 form.setCanEdit(true)

all Items become editable except RichTextItem. But as only I resize the IE (or FF) window it becomes editable and I can put text there.

Could you please fix it?
Thanks in advance

[Isomorphic]

We're not seeing this in tests, in any browser - please show sample code we can run that demonstrates the issue

[Oleg]

Thank you for the reply, Isomorphic.

Probably the cause is SectionStack.

Please find sample code files in the attachment.

Test case:
1. Press "Edit form" button
2. Try edit TextItem and RichTextItem
3. Resize IE window
4. Edit RichTextItem

In case you expand and collapse "Form Section" before test, you will be able edit RichTextItem on step 2.

[Isomorphic]

We see a redraw issue here which we'll fix in the builds.

However, note that if you are expecting to be able to edit the contents of the TextItem in your sample, as well as the RichTextItem, you want to use setDisabled() rather using setCanEdit() - the latter, set before initial draw, renders text items as static text which can not be edited.

[Oleg]

My application is bit more complex. In second section of sectionStack I have a ListGrid and editForm is bound to it.
Depending on privileges some people can edit form but others can read only.
In case I use editForm.setDisable people who have read only privilege will not be able copy data from form Items.

However thank you very much for this hint. I will use it for a while.

[Isomorphic]

In the meantime, just redrawing both the stack and the form in your click method will make this work for you:

        stack.expandSection(0);
        stack.redraw();
        form.setCanEdit(true);
        form.redraw();

[Oleg]

This workaround works fine. Thank you Isomorphic!

[Oleg]

Hi Isomorphic

It seems the bug was fixed, but not I was expected for. Now it's possible to edit RichText item even when I set

form.setCanEdit(false);

Could you please fix it?

BTW: BackSpace doesn't work in RichText items.


SmartClient Version: v9.0d_2013-06-20/LGPL Development Only (built 2013-06-20)
SmartClient Version: v9.0d_2013-07-01/LGPL Development Only (built 2013-07-01)

FF22, IE9

[Oleg]

I have found that bug is not fixed for v8.3p_2013-06-30/LGPL Development Only (built 2013-06-30).

[Isomorphic]

We see the issue with backspace not working (actually, a JS error was being reported in the dev console) and that's been fixed for builds dated July 6 and later.

But we don't see any issues with setCanEdit() as per your sample code - is it specifically *IE8 only*, not even other versions of IE, that you see this in?

If the sample code has been altered at all, please re-post as it is now - if not, please provide any additional information that may help to diagnose the issue.

[Isomorphic]

Actually, we now see that you're on 4.0 and there was indeed an editability issue there - it's fixed now, please retest with a build dated July 6 or later

[Oleg]

Hi Isomorphic

Thank you for the responce.

To be clear I am testing the changes in my application. It has followin structure:

    ds = new RestDataSource();

    form = new DynamicForm();
    form.setDataSource(ds);

    grid = new ListGrid();
    grid.setDataSource(ds);
    
    ValuesManager tabVm = new ValuesManager();

    final SectionStack sectionStack = new SectionStack();  
    final SectionStackSection editFormSection = new SectionStackSection(); 
    final SectionStackSection listGrigSection = new SectionStackSection();  

    tabVm.setDataSource(form.getDataSource());
    tabVm.addMember(form);

    grid.addRecordClickHandler(new RecordClickHandler() {  
        public void onRecordClick(RecordClickEvent event) {

            editRecord (false);
				
            }  
    });  

    grid.addRecordDoubleClickHandler(new RecordDoubleClickHandler () {  
        public void onRecordDoubleClick(RecordDoubleClickEvent event) {

           editRecord (false);
           sectionStack.expandSection(0);

        }  
    });  

    editFormSection.setItems(form);
    listGrigSection.setItems(grid);  

    sectionStack.setSections(editFormSection, listGrigSection); 
    sectionStack.setVisibilityMode(VisibilityMode.MULTIPLE);  

    private void editRecord(boolean isNew) {

        if(isNew){
            tabVm.editNewRecord();
        }else{
            tabVm.editSelectedData(grid);
        }
			
        form.setCanEdit(true);
    }

Below was tested for
SmartClient Version: v9.0p_2013-07-07/LGPL Development Only (built 2013-07-07)

Bug 1 : can't edit RichTextItem after form.setCanEdit(true)
IE9 - BUG
FF22 - BUG
still need resize the form

Bug 2 : can edit RichTextItem after form.setCanEdit(false)
IE9 - fixed
FF22 - fixed

Bug 3 : backspace doesn't work
IE9 - fixed
FF22 - fixed

Bug 4: the height of RichTextItem is not 100% of form. gets 100% after redraw

when calling tabVm.editSelectedData(grid), the RichTextItem on form gets height exactly equals to number of rows in RichTextItem.value and form does't fit to 100% of SectionStackSection height.
After manual resizing of section or window the RichTextItem fills all free space of the form.

IE9 - BUG
FF22 - OK

Bug 5: calling for the same record in grid (2 clicks on record in grid)
tabVm.editSelectedData(grid);
tabVm.editSelectedData(grid);

fires form.onItemChanged for richTextItem.

IE9 - BUG for records with <BR> tag created in FF22
FF22 - BUG for records with <BR> tag created in IE

tabVm.changedValues: {}


Bug 6: FF22: resize of form or window fires form.onItemChanged on richTextItem for records created in IE

tabVm.oldValues: wewr<BR>wrrt<BR>ewrwetr<BR>
tabVm.changedValues: wewr<br>wrrt<br>ewrwetr<br>

Bug 7: For records created in IE: When RichTextItem.value has HTML table tag (for example copied from Outlook) it fires form.onItemChanged for richTextItem on tabVm.editSelectedData(grid)

changedField = comment;
 
oldValues: {values from record that was selected before}; 

changedValues: {comment=<TABLE style="WIDTH: 128.8pt; BORDER-COLLAPSE: collapse; mso-yfti-tbllook: 1184; mso-padding-alt: 0cm 0cm 0cm 0cm" class=MsoNormalTable border=0 cellSpacing=0 cellPadding=0 width=172>
<TBODY>
<TR style="HEIGHT: 12.75pt; mso-yfti-irow: 0; mso-yfti-firstrow: yes">
<TD style="BORDER-BOTTOM: #f0f0f0; BORDER-LEFT: #f0f0f0; PADDING-BOTTOM: 0cm; BACKGROUND-COLOR: transparent; PADDING-LEFT: 5.4pt; WIDTH: 128.8pt; PADDING-RIGHT: 5.4pt; HEIGHT: 12.75pt; BORDER-TOP: #f0f0f0; BORDER-RIGHT: #f0f0f0; PADDING-TOP: 0cm" vAlign=bottom width=172 noWrap>
<P style="TEXT-ALIGN: center; LINE-HEIGHT: normal; MARGIN: 0cm 0cm 0pt" class=MsoNormal align=center><SPAN style="FONT-FAMILY: 'Arial','sans-serif'; COLOR: black; FONT-SIZE: 7.5pt; mso-fareast-font-family: 'Arial Unicode MS'">Line1<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" /><o:p></o:p></SPAN></P></TD></TR>
<TR style="HEIGHT: 12.75pt; mso-yfti-irow: 1; mso-yfti-lastrow: yes">
<TD style="BORDER-BOTTOM: #f0f0f0; BORDER-LEFT: #f0f0f0; PADDING-BOTTOM: 0cm; BACKGROUND-COLOR: transparent; PADDING-LEFT: 5.4pt; WIDTH: 128.8pt; PADDING-RIGHT: 5.4pt; HEIGHT: 12.75pt; BORDER-TOP: #f0f0f0; BORDER-RIGHT: #f0f0f0; PADDING-TOP: 0cm" vAlign=bottom width=172 noWrap>
<P style="TEXT-ALIGN: center; LINE-HEIGHT: normal; MARGIN: 0cm 0cm 0pt" class=MsoNormal align=center><SPAN style="FONT-FAMILY: 'Arial','sans-serif'; COLOR: black; FONT-SIZE: 7.5pt; mso-fareast-font-family: 'Arial Unicode MS'">Line2<o:p></o:p></SPAN></P></TD></TR></TBODY></TABLE>
, .......}

Bug 8: Expand SectionStackSection with empty form fires form.onItemChanged for richTextItem

changedField = comment;
oldValues: {};
changedValues: {comment=null}

IE9 - BUG
FF22 - OK