The rule for Count List of Data in An MDK App
To enhance your MDK app with customer order information, you need to carry out the following tasks:
- Create a new order list page
- Create a new order details page
- Create a new navigation action to the new order details page
- Write a JavaScript logic to calculate the total number of orders for a customer
- Display top 5 orders on the customer detail page
- Add a header control to the orders grid of the customer detail page to display a text label
- Add a footer control to the orders grid of the customer detail page to show the total order count
Use the mobile development kit page to create a new page for displaying a customer list and count total customers.
Use the mobile development kit page to create a new page for displaying a customer list and count total customers.
You will learn here.
1.How to create a new page and add some controls and display customer information.
2.How to navigate one page to another page.
3.Logic to write rule to count data in list.
4.How to create button.
Steps to follow:
Create a customer list page and add contact cell table to the page to display customers list.
Create a rule to count customers.
. Mention Rule in customer page footer section to display total customers.
Create navigation action to move from main page to customers page.
Add a new button in main page and by clicking that button navigate to customer list page.
Deploy app to SAP Cloud Platform Mobile Services.
Sync and Update the app with new changes.
Conclusion
————————————————————————————————————————————–
Step 1.
Create a customer list page and add contact cell table to the page to display customers list.
In SAP Webide Project
Right Click on the Pages– New MDK Page – Select “Section Page” – Next – Give Page Name as “Customers” – Next – Finish
Now Customers.page created.
Copy and Paste the below code.
export default function CustomersCount(sectionProxy) {
return sectionProxy.count(‘/DemoApp/Services/MDPAppService.service’, ‘Customers’, ”).then((count) => {
sectionProxy.getPageProxy().getClientData().EquipmentTotalCount = count;
// If “Customers” Entity set is availale, then it return the total customers
return count;
});
}
CountCustomer.js file will look like below image
————————————————————————————————————————————–
Step 4. Create navigation action to move from main page to customers page.
Right Click on Action Folder – New MDK Action – Select Navigation Action – Next – Give the Action name as “Customers” and select pageToOpen as Customers.page path from dropdown
Now Navigation Action Customers.Action is created.
————————————————————————————————————————————–
Step 5. Add a new button in main page and by clicking that button navigate to customer list page.
In main.page drag and drop the section button table from container control.
Under Event tab click link icon for OnPress Handler to select the customer.action.
Now you can navigate by clicking customer button.
Step – 6. Deploy app to SAP Cloud Platform Mobile Services.
Right click on your App or Project | Next |Next .
After Deploy completion you can See Deploy Successfully.
————————————————————————————————————————————–
Step 7. Sync and Update the app with new changes.
You can see total customers.
8. Conclusion
As per written code for counting the total number of customers you can perform with minimum number of lines of code, And you can use the logic to perform the counting the other list of data. Also if you add or delete customers then you will get the result accordingly.
