Page History

...

Step - 1 : Now add one more menu item to by name "PersonForm" to your PracticeMenus.xml file.
Step - 2: Create one file in widget by name PracticeForms.xml and create a list form for showing the records from person entity.
(Take reference from ExampleScreens.xml and ExampleForms.xml files).

 <form name="ListPersons" type="list" list-name="persons" list-entry-name="person" target="updatePracticePerson" paginate-target="personForm">
               <auto-fields-service service-name="updatePracticePerson" default-field-type="editdisplay" map-name="person"/>
        <field
</form>

Step - 3 : Create new screen by name personForm and include this list form in it.

<screen name="partyId"><hidden/></field>PersonForm">
        <field name<section>
            <actions>
                <set field="submitButtonheaderItem" titlevalue="UpdatepersonForm" widget-style/>
                <set field="smallSubmittitleProperty"><submit button-typevalue="buttonPageTitlePracticePersonForm"/></field>>
                       <field<entity-condition entity-name="deletePracticePerson" title="Delete Person" widget-stylelist="buttontextpersons"/>
        <hyperlink target="deletePracticePerson?partyId=${person.partyId}" description="Delete"/>
      </field>
</form>

Step - 3 : Create new screen by name personForm and include this list form in it.

<screen name="PersonForm">
        <section>
            <actions>
                <set field="headerItem" value="personForm"/>
                <set field="titleProperty" value="PageTitlePracticePersonForm"/>
                <entity-condition entity-name="Person" list="persons"/>
            </actions>
            <widgets>
                <decorator-screen name="CommonPracticeDecorator" location="${parameters.mainDecoratorLocation}">
                    <decorator-section name="body">
                        <label text="Person List" style="h2"/>
                        <include-form name="ListPersons" location="            </actions>
            <widgets>
                <decorator-screen name="CommonPracticeDecorator" location="${parameters.mainDecoratorLocation}">
                    <decorator-section name="body">
                        <label text="Person List" style="h2"/>
                        <include-form name="ListPersons" location="component://practice/widget/PracticeForms.xml"></include-form>
                    </decorator-section>
                </decorator-screen>       
            </widgets>
        </section>
</screen>

...

Step - 3: Include this UI Label resource in your main decorator screen which you created earlier and use these one or two ui labels which you are having now.Step - 4 : Use those 2 UI labels at appropriate places.
Note : Always search first for any existing Ui label in ofbiz and if you don't find it there then only create new one.
Now run the application and see the output screen as bellow from :
Output Screen:
Image Removed Image Added

Now its time to make this practice application secure by checking authentication (user login):

...

<service name="createPracticePerson" default-entity-name="Person" engine="simple"
          location="component://practice/script/org/hotwax/practice/PracticeServices.xml" invoke="createPracticePerson" auth="true">
     <description>Create a Person</description>
     <auto-attributes include="pk" mode="OUT" optional="false"/>
     <attribute name="salutation" mode="IN" type="String" optional="true"/>
     <attribute name="firstName" mode="IN" type="String" optional="false"/>
     <attribute name="middleName" mode="IN" type="String" optional="true"/>
     <attribute name="lastName" mode="IN" type="String" optional="false"/>
     <attribute name="suffix" mode="IN" type="String" optional="true"/>
</service>  
" mode="OUT" optional="false"/>
     <attribute name="salutation" mode="IN" type="String" optional="true"/>
     <attribute name="firstName" mode="IN" type="String" optional="false"/>
     <attribute name="middleName" mode="IN" type="String" optional="true"/>
     <attribute name="lastName" mode="IN" type="String" optional="false"/>
     <attribute name="suffix" mode="IN" type="String" optional="true"/>
</service>  

similar for Update and Delete 
Step - 3: Now convert the List form with editable field(Ref. ListExampleItems from ExampleForms.xml) and add Update and delete option with it and also in the same screen there is add form also. As shown bellow

<form name="ListPersons" type="list" list-name="persons" list-entry-name="person" target="updatePracticePerson" paginate-target="personForm">
        <auto-fields-service service-name="updatePracticePerson" default-field-type="edit" map-name="person"/>
        <field name="partyId"><hidden/></field>
        <field name="submitButton" title="Update" widget-style="smallSubmit"><submit button-type="button"/></field>
        <field name="deletePracticePerson" title="Delete Person" widget-style="buttontext">
        <hyperlink target="deletePracticePerson?partyId=${person.partyId}" description="Delete"/>
      </field>
</form>

Step - similar for Update and Delete 
Step - 3: Now convert the List form with editable field(Ref. ListExampleItems from ExampleForms.xml) and add Update and delete option with it and also in the same screen there is add form also.
Step - 4 :  Create controller entries for these services which are going to be called by this form.
Now run the application and see the output screen as bellow:
Output Screen:
Image Added

Writing Events:

...