Editable Web Listbox Cell Project Needs Input

it’s been a long time since this topic was last known, would it be possible to see the example of the editable weblistbox? i am facing a similar situation. Thank you

I deleted the project a while back. I have it integrated into my main project so I can help if you have any questions.

Hi JL, thanks for replying. I’m not an expert in javascript, the help I ask is if you can give me directions on what to insert in the app header and in kjavascriptclass to obtain a weblistbox with an editable cell. Thank you

Give me just a short bit and I will put together an example. 20 minutes or so.

Thanks for your time

Here is an example. Grab the class and name it whatever you want. Grab the style in the app header. In the listbox open event is an example on how to use it. If you need to know how to get the value from the cells then just let me know. But this shows how to create the class and how to use the editable cell. You can change all the style and background color in the style.

https://drive.google.com/file/d/1sHgSysklDBVwjnjR5hdbjOYOzze0mXQY/view?usp=share_link

1 Like

Thank you 1000, I study your example.

You’re welcome. Let me know if you need anything else for it.

Hi JL,
you are right, the next step is to be able to read the value written in the cell, could you tell me how to do it? I thought I can assign the value to the cell tag while creating it, but still I need to read it if the user modifies it.
Thanks again

Ok. Give me a few minutes to try to figure out what to pull. I’ll update the link again.

Here it is. Added in a listbox class with custom events defined. Then on the text changed event for the listbox it sets the text field to the cell value of the listbox.

Listbox Example 2

Hi JL,
perfect, you gave me a big help to proceed with my project.
Thank you very much.

1 Like

Your welcome! Have a great night.

1 Like

Hello,
I am looking at you example to edit a webtextfield. I am trying to incorporate into my app. What I got it so far where I click on the row I want (I am just changing Column 0), I am able to copy the contents of the current value but I can’t type or edit the value. for example, I click oh the last row below (REP. GUARDALODO DEL. RH) and I get to copy the value to the edit box but I can’t change it.

image

I did notice that there is an event “CustomCellAction” that I did not see in my current Weblistbox.

Maybe you have an updated example where the weblistbox has a few rows and I can edit the content of the first column on the row I clicked? That is what I am looking to do

Can you share an example?
Maybe someone can look at the code and see what needs to be changed.

@AlbertoD thanks for the reply. I almost got it to do what I want but with a text field. In Web 2, how can I get the mouse x and y? or if there is a better way to move the webtextfield to where the user clicks the mouse? Or on top of the corresponding row (column always 0)

Does that makes sense of what I want to do?

You posted above that you were able to copy the contents to the edit box, but now it looks like you want to know the mouse x and y to use a regular WebTextField.

If you were able to use the example in this thread and put the information on the edit box, is not better to be able to change the information (if possible) instead of trying to use the mouse x and y to do a different thing?

If you share a sample a sample project on what you want to do maybe it will be easier to suggest solutions.

Is this what you want?
screencast2024-04-0416-13-53-ezgif.com-optimize

I downloaded the ‘Listbox Example 2’ above, changed CustomListbox1 open event to:

//open event
Me.AddRow("REP. BUMPER DEL.","$4,500.00","1","$0.00","$4,500.00")
Me.AddRow("REP. BUMPER TRAS.","$4,500.00","1","$0.00","$4,500.00")
Me.AddRow("INST. FLEAR GUARDALODO DEL","$2,250.00","1","$0.00","$2,250.00")
Me.AddRow("REP. GUARDALODO DEL.","$4,500.00","1","$0.00","$4,500.00")

changed CellTextChanged to:

//CellTextChanged event
If column = 0 Then
  TextField1.Text = cellvalue
  //Need to update the listbox cell ?
  Me.CellTextAt(row, column) = New StyleClass_ListboxEditableCell(cellvalue)
End If 

Note: I need to finish the edit with Return/Enter key, at least it looks like that to fire this event
added DoublePressed event:

//DoublePressed event
If column = 0 Then
  Var myvariant As Variant
  myvariant = Me.CellTextAt(row,column)
  If myvariant IsA StyleClass_ListboxEditableCell Then
    Me.CellTextAt(row,column) = StyleClass_ListboxEditableCell(myvariant).CellValue
  Else
    Me.CellTextAt(row,column) = New StyleClass_ListboxEditableCell(myvariant.StringValue)
  End If
End If

This is a quick change, haven’t tested much. I hope this helps.

Yes,
Almost there. I incorporated it in my app and I got it to behave like the sample you posted. I tried different things but quite don’t understand like:

  1. How to make the field that pops up wider.
  2. How to do the ENTER event so it will close the edit window, like doing double-click the second time now. On enter (or TAB), I will be updating the DB with the changes. I already have the procedure for it but I need to do it after pressing enter.
    If you also noticed, I have a RED button that I had when the user did the double click to give them the option to erase the row.
    ezgif-7-ae2f4382f2

For 1, I don’t know. I didn’t review the code just “make it work” for your needs.
For 2, check the code added to DoublePressed event and adjust it to add what is missing in CellTextChanged event, so when you press Return/Enter you close the edit Style and do your db saving.