Add, edit and delete contact persons: Interface Persistence

After having created the company management section, it is time to build the other half of this application: the contact management section.

This section's pages are stored in the contacts folder, and will perform the addition of new contacts, editing existing contact data and finally deleting a contact. The actions themselves will be added by using the Insert Record Form Wizard, Update Record Form Wizard and the Delete Record Transaction , same as for the companies. There are however some differences, apart from the table and fields name to use, due to the fact that a contact cannot exist without a company. Thus, when adding a contact you must specify which company he stands for.

Note: Before proceeding with the wizards, notice that the index page inside the contacts folder already contains a dynamic table that lists all the current contacts, no matter the company.

Building the insert page

For the insert page, follow the same steps as for the company insert page: page design and wizard configuration.

In terms of design, the same layout will be used: the page header, a horizontal rule, and the wizard generated elements. Use the instructions presented for the company section to create the design for this page too. Remember however to change the "Add new company" text into "Add contact".

When it comes to the Insert Record Form Wizard, there are some minor changes. Start the Insert Record Form Wizard from the MX Kollection tab of the Insert bar to add the HTML form. At first, the dialog box's fields are filled with the user interface persistence cache options, using the company_com table and its related fields. You will have to change these settings only for the first wizard, as the rest will use the user interface persistence.

In the Insert into table drop-down menu, select the contact_con table, instead of company_com. If the correct id_con column is not selected by default in the Primary key column drop-down menu, select it.

The page to redirect to will be the main index file, situated in the site root. If the correct file is not selected, use the Browse button to navigate through your site's folders.

When all options are set, click the Next > button to proceed to step two of the wizard.

The second step of the wizard allows you to select what fields will be displayed in the page, their order and input method. For most fields you can leave them at their defaults: the names to be displayed next to the form controls are the field names, without the three letter suffix. The type of content to submit (the Submit as drop-down menu's content) is retrieved based on the table meta information.

The only element that needs to be changed is the idcom_con field. This field is the foreign key, storing the link to the company table. If left as a text field, the company's identifier (a numeric value) would need to be entered by hand. A much better way to select the company is to have a drop-down menu listing all the companies by name and when selected, automatically inserts the company ID.

To use the latter method, follow these instructions:

1. Select the idcom_con field in the grid.
2. First change its name to something more human - readable, like Company:
3. Second, change the element used to display it, by selecting in the Display as drop-down menu the Menu option.
4. Two new buttons have appeared: Menu properties and Add Recordset . Usually, to display dynamic data in the drop-down menu you had to cancel the wizard, create a recordset, and then re-start the Insert Wizard. The Add Recordset button solves this problem, as it will open the Recordset dialog box without leaving the wizard.
5. After clicking on the Add recordset button, configure a new recordset, rsCompany that will retrieve all companies from the table:
   
   
6. After you've added the recordset, you can use the Menu Properties button to instruct it to display data from the database:
   · Click on the From database radio-button, so that elements will be retrieved in a dynamic manner.
   · In the Recordset drop-down men select the one you've just created.
   · In the Get labels from and Get values from select the table fields containing the company names, respectively ID's.
   
   
      
7. After you've set the menu properties, you can click on the Finish button to complete the wizard.
   
   Note: If you are using a Microsoft Access database, in the Submit as drop-down menu, for the birthday_con field, another option will be available: Date MS Access. Select this option when submitting the date.
   
   

Now the contact insert page is complete, and you can preview it in the browser by pressing the F12 key. Select a company name from the drop-down menu and enter the contact details. When you click the Insert Record button, a new contact is added, having the idcom_con field equal to the selected company's ID.

Note: Make sure you have chosen the desired database and screen date formats from the InterAKT Control Panel -> Date formats category. For more information on configuring and working with date formats, please read Date formats.

Building the update page

This page will allow you to update details regarding a contact. The update form is similar to the insert one, but it is by default populated with the selected contact's data. The most common way to select the contact to update is to pass its unique identifier as an URL parameter. Therefore, when calling the update page, you will need to pass it the ?id_con=value part. (assuming that id_con is the URL parameter's name).

For the page design, follow the same steps as for the company update page. Add the page header, changing the text to "Modify contact information". Add the horizontal rule too, and after creating a new paragraph below, start the Update Record Form Wizard.

From the first look, you can see that all fields are now filled for the contact_con table. The user interface persistence remembered that the last table used was contact_con and it automatically loaded the settings for it. Also, the additional field, Primary key equals is set to URL Parameter, with the name id_con. These are the default options, but they are perfect for this page. You can simply click on Finish to complete the wizard as the fields are remembered from the Insert Record Form Wizard.

To enhance the page, add the contact's name in the page header. First add the "for" text to the header, and then drag and drop the name_con field from the Bindings tab into the page, after the header text.

Building the delete page

This page will allow you to delete contacts from the database. The logic is implemented through the Delete Record server behavior . Similar to the update page, the contact's unique identifier must be passed to the page through an URL parameter. Also, a safety net, similar to the one created through page design for the company's delete page will be implemented (the table displaying details for the contact to be deleted - name and job - and the two buttons).

Create the page design following the same steps as for the company delete page; display the contact name and email address in the table, and use the contact_con table when creating the recordset. The URL parameter passed will be id_con.

Once the page design is finished, complete with the Yes/No buttons and apply the Delete Record server behavior. Since the user interface persistence is in effect for this wizard too, all you need to specify is the starting condition: the Form variable KT_Submit:

Now you have the entire suite of insert, update and delete operations completed and ready to use. Except for the insert page, which you can already test, for the others you have to create a way to pass them the correct identifier.

The simplest way to access the update and delete pages, is to place them in a list, together with two links: one for editing, and one for deleting.