Auto-Fill textbox in InfoPath

In this article we can explore how to Auto-Fill a textbox in InfoPath form within SharePoint 2010.

What is the Scenario?

Following is our Customer list with Code & Name.


Following is our Product list which has lookup to Customer Code.


On selection of the Customer Code dropdown list, we need to auto-fill the Customer Name text box.



In typical ASP.NET Forms we can use JavaScript to attain this functionality. But InfoPath web part enabled pages seldom works with JavaScript.


Please follow the steps below to attain the solution.

Step 1: Create Lists

Create the Customer list with 2 columns:

1. Code as Text

2. Name as Text

Create the Product list with 3 columns:

1. Product Code as Text

2. Customer Code as Lookup (connecting to Customer > Code)

3. Customer Name as Text

Step 2: Create InfoPath form

Open SharePoint InfoPath Designer 2010 from your start menu.


In the Initial Screen choose the SharePoint List & Click the Design Form button.


You will get the following wizard. Enter your site url & click Next button to continue.

(Please use only site url & not the list url. Enter Credentials if prompted)


In the next page choose the Customize option & select the Product list. Click Next button continue.


Click the Finish button.


You will get the following screen.


Step 3: Create Data Connection

On change of Customer Code drop down, we need to use the Code to search in Customer list & bring the Name field. For this, we need a Data Connection.

Choose the Data tab and click on Data Connections button.


In the appearing dialog box enter click the Add button.


Choose the Receive data option & click Next button.


In the next page choose the SharePoint list option.


In the next page leave the url of the site as it is.


In the next page choose the Customer list as the source.


In the next page select the Code and Name properties.


Click the Next button & Enter the name as CustomerDS for the data source.


We are now ready with our Data Source to query against.

Step 4: Modify form

We need to modify the Customer Name textbox. Right click on it & choose the Textbox Properties menu. You will get the following dialog.


Choose the Formula Editor which is the highlighted button above. In the appearing dialog, choose the Insert Field or Group button.


In the appearing dialog box, choose the Show advanced view link.


Now you will be able to select the CustomerDS data source. Expand the Data fields below & choose the Name property as shown below. (Do not close the dialog)


Click the Filter Data button to enter our filter condition. In the appearing dialog box, click the Add button to add the filter. Choose the ID property against Select a field or group.


You will get the following dialog box.


Choose the Main data source and select the Customer Code property. Click the OK button. The filter condition looks like below.


You might be wondering why we are comparing ID property against Customer Code:

· In the background the Customer ID is stored & hence ID comparison is needed.

Close all the dialog boxes clicking OK button & the Properties dialog box looks like below.


Click the OK button to close the dialog box.


The Value says to take the Name property when ID equals to Customer Code

Step 5: Save & Publish

Save the form & Click on the Publish button.


You will get the following dialog box if no errors exists.


Step 6: Test the form

Click on the Open link above & choose the Add item in appearing page. Try selecting a Customer Code and you can see the Customer Name automatically set.


This concludes our experiment with InfoPath Auto-Fill.


For deleting an InfoPath form, Use Internet Explorer > Choose List Settings > Form Settings > Delete option.




In this article we have explored InfoPath Auto-Fill scenario using Data Sources & Filter. I hope this will be useful in real life scenarios.

Leave a Reply

Your email address will not be published. Required fields are marked *