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.20 - The Editable table now supports AutoScale compilation. The updated code requires Door library v1.2 or newer: http://www.b4x.com/forum/official-updates/4636-door-library-v1-2-a.html
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: http://www.b4x.com/forum/questions-help-needed/3371-combobox-editable-table.html#post19103
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 :sign0098:

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]

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
    [B]o.Value = obj.RunMethod3("HitTest",x,"System.Int32",editTable.y,"System.Int32")
    If o.GetProperty("Type") = "None" Then editTable.y = editTable.y - editTable.rowHeight
[/B]...

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]

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.

[I]txtEdit.SelectionLength = StrLength(txtEdit.Text)[/I]
[B]oh.SetProperty("Enabled", false)
ov.SetProperty("Enabled", false[/B])
[I]txtEdit.Focus[/I]

 

[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]

Table Without the accept button 'X'

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...

 

[Rioven]

Hi

I made this changes on Erel's EditableTable...but doesn't work when selecting partially diplayed cells and scroll bars...

Sub eventScrollH_NewEvent
btnAccept_Click
End Sub
Sub eventScrollV_NewEvent
btnAccept_Click
End Sub

Needs to put it back to original...

Sub eventScrollH_NewEvent
pnlEdit.Visible = False
End Sub
Sub eventScrollV_NewEvent
pnlEdit.Visible = False
End Sub

CORRECTED File on my previous post...

My only problem now is on device, when updating cell entry and then drag scroll bars, the cell will display unchanged content, but when you select this cell again, it will appear the updated content. What is the best thing to do?

 

[Erel]

A new version (1.10) was uploaded. See the first post.

 

[outlawz]

Hi to you all. Can someone help me how the sub: Sub Validate(column, value) is called? I wanna check if i can add another parameter (the row or another field value of that record, like the primary key field).
If i can, then it is easy to update de database by a SQL command.
I can´t believe i was the entire morning with this isue. Help me masters please.

Thanks,

 

[Erel]

Sub btnAccept_Click
If cmbEdit.Visible = True Then
value = cmbEdit.Item(CmbEdit.SelectedIndex)
Else
value = txtEdit.Text
End If
pnlEdit.Visible = False
If tables(currentTable).validator <> "" AND _
CallSub(tables(currentTable).validator,Control(TableName,Table).SelectedCol,value, New Parameter) = False Then
Return
End If
Control(TableName,Table).Cell(Control(TableName,Table).SelectedCol, _
Control(TableName,Table).SelectedRow) =value
End Sub

 

[outlawz]

Good night, Erel i have a problem that i´m not able to solve. As I said today, I´m struggling to get database update working. As it is right now, the DB is updating but gives a overflow error. I tried to put the SQL update where you said, but in there is before the validation process, so i put it after that process.
Could you please take a look when you can? I don´t like to be asking things all the time, i like to fight the things till i figure it out how to solve, but in that case is very hard, i guess i started with a not newbie project.

Thanks again for all your help.

Regards

 

[Erel]

You should use ExecuteNonQuery instead of ExecuteTable.
An UPDATE operation doesn't return any value. ExecuteTable takes the result of a query and inserts it to a table.

 (line 36)
        cmd.CommandText = "UPDATE inventario SET conta = "& value & " WHERE IDPK = "& chave
        cmd.ExecuteNonQuery

 

[outlawz]

Thanks Erel, i need to read more the Basic4PPC commands to avoid stupid questions like i did. Now it works fine on the desktop but gives me always errors on the device: "NullReferenceException". I searched the forum but i was not able to find any related problem.
Anybody here had the same issue?

Thanks,

 

[Erel]

Which line gives this error?

 

[outlawz]

Hi Erel, don't indicates lines:

First - An error occurred on sub __main_tamanhocolunas. NullReferenceException
Continue? -- If I put yes then i try to change a cell value and:

Second - An error occurred on sub __main_validate.
NullReferenceException
Continue? -- If I put yes ther errors repeat on the sames choices.

Never updates. On desktop all OK.

Thanks

 

[Erel]

Please start a new thread and also post the code of these two subs.
Thanks,
Erel