How Can The User Edit Field Content in a Data Grid Form?

The data grid commands for creating an editor for a particular field in a row template. This lesson will show you how to use them.

What You Need to Know

In order to edit field contents in a data grid form you need to know about the following:

1) The EditFieldText command

2) The EditValue message

3) The EditKey and EditKeyOfIndex commands

Read up on the entries for EditFieldText, EditValue and EditKey/EditKeyOfIndex in the API documentation.

EditFieldText

The EditFieldText command will create an editor for a field that you specify. You can use this command to create a field editor for a field in your row template.

EditValue

EditValue is the message that is sent to a row when a request to edit a fields contents has been made. You can call EditFieldText from within this message to begin an editing operation.

EditKey and EditKeyOfIndex

EditKey and EditKeyOfIndex will trigger the EditValue message in a row. Each takes the name of the key you want to edit and the line or index you want to edit. Here are two example scripts showing how you could use these commands in the script of a data grid.

## Placed in script of row template behavior
on mouseDown pBtnNum
	if pBtnNum is 1 then
		## Did the user click on the FirstName field?
		if the short name of the target is "FirstName" then
			put "FirstName" into theKey
			put the dgHilitedLine of me into theLineNo
			EditKey theKey, theLineNo
		end if
	end if
end mouseDown
on mouseDown pBtnNum
	if pBtnNum is 1 then
		## Did the user click on the FirstName field?
		if the short name of the target is "FirstName" then
			put "FirstName" into theKey
			put the dgHilitedIndex of me into theIndex
			EditKeyOfIndex theKey, theIndex
		end if
	end if
end mouseDown

Either of the above calls will trigger the EditValue message. The EditValue can be thought of as a central message where you can open a field for editing text. This message is where you will call EditFieldText.

on EditValue pKey
	## Example of opening a field editor for the field displaying the value for pKey
	## Since I'm passing in parameters 2 and 3 any changes will automatically be saved to the dgData.
	## 'me' is the Data Grid in this case.
	EditFieldText the long id of field pKey of me, the dgHilitedIndex of me, pKey
end EditValue

CloseFieldEditor

If the user changes any content in the field editor this message will be sent to the field targeted in the first parameter sent to EditFieldText. Read the API docs for EditFieldText which discusses this message.

Here is an example of storing the new value in the dgData of the Data Grid in the CloseFieldEditor handler. Manually storing the value would be required if you only passed in one parameter to EditFieldText.

This example script would be in the Row Behavior script as it uses the dgIndex of me property.

on CloseFieldEditor pFieldEditor
	## 'me' is the row control
	put the dgIndex of me into theIndex
	put the dgDataOfIndex[theIndex] of the dgControl of me into theDataA
	put the text of pFieldEditor into theDataA[the dgColumn of me]
	set the dgDataOfIndex[theIndex] of the dgControl of me to theDataA
end CloseFieldEditor

11 Comments

Michel F. Lukawecki

Hi.

Totally lost, here.

I created a test datagrid form. Put some data into it. Without any special "programming", I can double-click on a line and edit it!

What's the point of using the procedure described in this lesson???

Thanks!

Elanor Buchanan

Hi Michel,

This procedure is for if you have created a custom row template for your Data Grid from or if you want to change the default behavior for editing field content. If you have a look at the script for the row in a new Data Grid form you will see that there is a mouseDoubleUp handler which checks the target and calls EditFieldText. If you want to add more fields or modify how a user chooses to edit a field you would follow this lesson.

If the default behavior provides what you need then you don't need to make any changes to the script.

I hope that helps.

Kind regards

Elanor

Joan Subiros

I am newbie, and I come from filemaker world.
It's so difficult for me to understand the code to edit fields in the data grid. I would like a lesson for dummies.

Elanor Buchanan

Hi Joan

Depending on what you want to achieve you may not need the features described in this lesson.

If you are using a DataGrid table you can use the default behavior so when you double click in a field it becomes editable. This lesson only applies to Data Grid forms. If you are new to LiveCode and Data Grids I would try working with Data Grid tables before moving on to forms.

If you can describe what you want to achieve I might be able to help more.

Elanor

Daniel

Hi

Tried to bring this on live.
First: "put the text of pFieldEditor into theDataA[the dgColumn] of me" generates an error
possible solution "put the text of pFieldEditor into theDataA[the short name of the target] of me

Questions:
How are you writing back the result into the grid form array?
Can you send me this example which runs?

Daniel

Elanor Buchanan

Hi Daniel,

Thanks for spotting this. The correct code is

put the text of pFieldEditor into theDataA[the dgColumn of me]

I have updated the lesson with the correction. This should update the internal data array of the Data Grid with the new text.

Kind regards

Elanor

Daniel

Hi Elanor

Bad news - the dgColumn of me ist empty in that case. In the short name of the target ist correct "FirstName"
I tried with this syntax: answer the dgColumn of me & "/" & the short name of the target

Maybe you can check this :-).

Best regards

Daniel
Best regards
Daniel

Elanor Buchanan

Hi Daniel

It does look like the dgColumn is not being returned in this case. I'll look into this but in the meantime it looks like there are a couple of options you might be able to use.

1. Pass all three parameters to EditFieldText. This should mean you do not need to implement CloseFieldEditor as the update will be handled automatically.

2. Use the short name of the target to get the column. This will work if the name of the control in the row template is the same as the column.

I hope that helps.

Elanor

Lagi Pittas

I have a program that I am writing that has data in a datagrid.

On windows double clicking on a cell allows editing on windows.
When compiled for android it is as if the datagrid is disabled.

On windows a sigle clich hilites the row in blue and a dopuble click allows cell editing.

How can a single press start editing on Android - and for future reference how can we have a single clich allow editing in windows

Thanks

Elanor Buchanan

Hi Lagi

The default behavior should be the same on Android. If it seems disabled it might be that the DataGrid inclusion is not being included when you deploy/build a standalone.Try selecting inclusions manually and ensuring DataGrid is selected in the Inclusions pane, along with any other inclusions you need.

I assume you are using a Table. For single click editing you can add a custom column behavior and include a mouseUp handler that does what mouseDoubleUp does by default. To customise the column behavior select the column in the Property Inspector and click the "+" button next to Column Behavior. Then click the "Column Behavior" button to open the script.

Here are some lessons you might find useful.

https://lessons.livecode.com/m/datagrid/c/2433

Kind regards

Elanor

Simon

I believe that this lesson does more harm than good. My thoughts are detailed in this forum post https://forums.livecode.com/viewtopic.php?f=7&t=38653&p=226070#p226070 . In brief the lesson does not explain enough and it also contains at least one error : dgColumn has no meaning in a datagrid form so the example CloseFieldEditor can not ever work.

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.