Editable Table - Device & Desktop

[Erel]

Using the attached code you can turn a regular table to an editable table.
The code uses the Door library to add a MouseDown event to the table control.
After calculating the cell upper left corner position, a panel with one textbox and one accept button is shown.



I hope you'll find this code useful.
It is more complex than it may seem because rows and columns could be partially or fully hidden.

Edit: V1.10 - Using the new modules feature all the editable code was moved to a separate module.
It is now possible to easily use more than one editable table in the same application.
Two new optional features:
- Validator - a sub that is called before changing any value and allows canceling the change if required.
- For each column you can choose whether to show a textbox or a combobox and choose the combobox values.
See this post for more details about using ComboBoxes: Combobox in editable table

Edit: V1.02 is attached. The edit panel will now disappear when one of the scrollbars is scrolled. The solution is based on agraham's code in post #7.
Edit: V1.01 is attached. It fixes the bug in post #4.

[agraham]

That's neat, I like that

However I can't work out why it needs a single pass through a timer Sub.

I tried disabling the timer and calling that Sub directly and it still seems to work the same, at least on the desktop. What subtlety am I missing that couldn't be achiieved with a suitably positioned DoEvents if a control refresh was required?

[Erel]

There are two subtle reasons why the timer is required.
MouseDown event occurs before SelectionChanged event.
At the end of SelectionChanged event the focus returns to the table.
So if we want to move the focus to the textbox we need to use the timer.
The second reason happens when you click on a partially hidden cell.
The table automatically scrolls the horizontal and/or vertical scrollbar in such way that the cell will be fully visible.
This rearrangement occurs after MouseMove event.
We must make the position calculations only after this rearrangement so again the timer is necessary.

[agraham]

Originally Posted by Erel

At the end of SelectionChanged event the focus returns to the table. So if we want to move the focus to the textbox we need to use the timer.

Thanks Erel, I hadn't noticed this - I see it now.

This rearrangement occurs after MouseMove event.

This took me a while to see. However there seems to be a bug/feature in that clicking on a partially exposed row 11 (last row) actually positions the text box on row 12 (non-existent) rather than on top of the cell on row 11 and clicking on a partially exposed row 11 cell 3 offsets the editbox to the right as well, both somewhat spoiling the effect. Additional tests needed perhaps?

[Erel]

Thanks agraham.
I've fixed this bug and updated the source code.
This is the change:

Sub CalcColumnPosition (colNumber)
    x = editTable.x
    o.Value = obj.RunMethod3("HitTest",x,"System.Int32",editTable.y,"System.Int32")
    If o.GetProperty("Type") = "None" Then editTable.y = editTable.y - editTable.rowHeight
...

Now we first check that the current position is a cell. If it is not a cell (which happens when we press on the last row and it's partially hidden) then y is updated to the previous row.

[Rioven]

Hi Erel,
How to catch the scroll bar properties on mousedown event on table?
I just want to disable the scroll bars during input so that the input panel will not be displaced from the selected cell when scroll bars are moved.

[agraham]

Originally Posted by Rioven

How to catch the scroll bar properties on mousedown event on table?

This code will disable the Scrollbars from user control, however the table will still re-arrange itself if clicked on a partially hidden cell. oh and ov are Door library Objects.

oh.New1(false) 
ov.New1(false) 
obj.FromControl(TableName)
o.Value = obj.GetProperty("Controls")
oh.Value = o.GetProperty2("Item",0) ' 0 = hscrollbar, 1 = vscrollbar
ov.Value = o.GetProperty2("Item",1) ' 0 = hscrollbar, 1 = vscrollbar
oh.SetProperty("Enabled", false)
ov.SetProperty("Enabled", false)

EDIT:- Oh - I now see why you want this. Leave most of the above code in App_Start and insert these two lines at the end of Timer1_Tick. The scrollbars seem to automatically re-enable after input.

txtEdit.SelectionLength = StrLength(txtEdit.Text)
oh.SetProperty("Enabled", false)
ov.SetProperty("Enabled", false)
txtEdit.Focus

[agraham]

A further slight improvement might be to allow Return to end an edit. Add this Sub.

Sub txtEdit_KeyPress (key)
 If key = Chr(13) Then
 	btnAccept_Click
 End If
End Sub

[Erel]

V1.02 is attached to the first post.
Based on agraham's code it hides the edit panel when the user scrolls the scrollbars.

[Rioven]

Hi Erel, Thanks very much for this very useful code. also thanks to agraham for other inputs.

Alternative updating table cell content which is... just leaving the cell.
This is more of my preference or maybe to some others.

I've made slight modifications which get rid of the accept button.
I've tested on device and found it works. maybe need to test with other devices.

here are what I did...
I have deleted the 'btnAccept' button and made some minor panel and textbox size adjustments...

then added ...

Sub txtEdit_lostFocus
btnAccept_click
End Sub

and also added 'btnAccept_click' on scroll bars

I hope I did it correctly...Please let me know

Regards,
Rioven


EDIT: updated file... see next post...