In my last blog, I introduced the new Visual Composer Modeling Resource Center. Now, I’m pleased to announce that we’ve added another Visual Composer application to the resource center – a “Task Management” application.
This Task Management iView is fairly basic but enables you to manage all your tasks, set priorities, define target dates to finish your tasks, search for a specific task and much more….
Just to remind you, the idea behind the Modeling Resource Center is to place different kinds of applications in one resource center so that we can all easily download the Visual Composer applications and enhance them according to our needs.
In this blog, I want to tell you about two problems I encountered when I was modeling the “Task Management” application and how I managed to solve them. You can find more information about the application (SQL script, gml files, documentation) here.
My first problem was that I didn’t know how to color the “Task List” table fields, which displays all the defined tasks. Each task has its own priority (Low, Medium, High, and Very High). I wanted to color the tasks in the table according to their priority – (Low – Green, High – Red, and so on) – but there was no way to do it directly “on” the table… )-:
The “trick” that I found was to add an expression box control to the “Tasks List” table (I named it – “ex_priority”).
I assigned the value of the task’s priority field to this virtual field.
In the Styles tab of the virtual field properties – I created four different styles with conditions so that the style of the field is determined according to the value of the priority field:
I closed the Control Properties dialog box, and in the Configure Element task panel I unchecked the visibility of the “original” Priority field and checked the visibility of the ex_priority field so that I could see only the new field in the “Tasks List” table.
That’s it – I saved the model, deployed and ran the application - here's how it looks at runtime:
Another problem I had was how to update the “Tasks List” table at runtime, after adding/editing a new task.
When adding a task using the “Add Task” input form, we click the Submit button to update the database, the Submit button triggers the addtask stored procedure and the clearfields stored procedure (you can find more information about the stored procedures in the application zip file which contains the sql script) and the result is that the database is updated with the details of the new task.
To close the form after clicking Submit, we need to click another button: Close.
My problem was that after updating the database, I had to refresh the browser or run the model again in order to see the new task in the “Tasks List” table….:-(
In this case, the “trick” that I found was to add a virtual field named “Update” to the “Task Details” form. In the connecting line to the end point of the popup iView, I assigned the value true to the update field.
The popup is connected to the “Task Detail” form. To this form, I added a plain text control with the text: "Data has been updated. Click Refresh” and defined a hidden condition “!@update==’true’” – when the update field value is true – to display the “refresh” message.
To the same form, I also added a Refresh button with a custom action: REFRESH. From this point, all I had to do was connect the output of the form to the input of the freesearch stored procedure and select REFRESH for the event name. (The freesearch stored procedure accesses the database and returns all the results from the task database table in the Tasks List table – including the new task – and actually refreshes the application at runtime).
And….Voila! It works!
After adding/editing a task, the refresh message appears and when the Refresh button is clicked, the new task appears in the “Task Lists” table…
This Task Management iView is fairly basic but enables you to manage all your tasks, set priorities, define target dates to finish your tasks, search for a specific task and much more….
Just to remind you, the idea behind the Modeling Resource Center is to place different kinds of applications in one resource center so that we can all easily download the Visual Composer applications and enhance them according to our needs.
In this blog, I want to tell you about two problems I encountered when I was modeling the “Task Management” application and how I managed to solve them. You can find more information about the application (SQL script, gml files, documentation) here.
My first problem was that I didn’t know how to color the “Task List” table fields, which displays all the defined tasks. Each task has its own priority (Low, Medium, High, and Very High). I wanted to color the tasks in the table according to their priority – (Low – Green, High – Red, and so on) – but there was no way to do it directly “on” the table… )-:
The “trick” that I found was to add an expression box control to the “Tasks List” table (I named it – “ex_priority”).
I assigned the value of the task’s priority field to this virtual field.
In the Styles tab of the virtual field properties – I created four different styles with conditions so that the style of the field is determined according to the value of the priority field:
I closed the Control Properties dialog box, and in the Configure Element task panel I unchecked the visibility of the “original” Priority field and checked the visibility of the ex_priority field so that I could see only the new field in the “Tasks List” table.
That’s it – I saved the model, deployed and ran the application - here's how it looks at runtime:
Another problem I had was how to update the “Tasks List” table at runtime, after adding/editing a new task.
When adding a task using the “Add Task” input form, we click the Submit button to update the database, the Submit button triggers the addtask stored procedure and the clearfields stored procedure (you can find more information about the stored procedures in the application zip file which contains the sql script) and the result is that the database is updated with the details of the new task.
To close the form after clicking Submit, we need to click another button: Close.
My problem was that after updating the database, I had to refresh the browser or run the model again in order to see the new task in the “Tasks List” table….:-(
In this case, the “trick” that I found was to add a virtual field named “Update” to the “Task Details” form. In the connecting line to the end point of the popup iView, I assigned the value true to the update field.
The popup is connected to the “Task Detail” form. To this form, I added a plain text control with the text: "Data has been updated. Click Refresh” and defined a hidden condition “!@update==’true’” – when the update field value is true – to display the “refresh” message.
To the same form, I also added a Refresh button with a custom action: REFRESH. From this point, all I had to do was connect the output of the form to the input of the freesearch stored procedure and select REFRESH for the event name. (The freesearch stored procedure accesses the database and returns all the results from the task database table in the Tasks List table – including the new task – and actually refreshes the application at runtime).
And….Voila! It works!
After adding/editing a task, the refresh message appears and when the Refresh button is clicked, the new task appears in the “Task Lists” table…
4 Comments
