This tutorial shows how to develop an application for letting users open and submit a new ticket, share tasks with deadlines, and see their task schedule. Users will be able to add files of any issue or request.
Preparing and Designing
Before start designing your app think about what kind of data you will need. For this example, we will need;
- Task Name: To type any request/issue
- TaskList1: To show off the request/ticket list
- NoteList: To show off the project that is submitted by someone
- Task Group: To choose a topic related to issue/request
- Heading: To name of the issue/request
- Files: To add any additional information
- Notes: To take some additional notes
- Description: Explanation of the issue/request
- Deadline: A specific time that given a ticket
- Person: An individual who submits the ticket
- Status: Status of the project (new, pending, in progress, etc.)
Buttons
- Save: To save the ticket
- New: To open a new ticket
- Submit: To submit the new ticket
Developing Application
Now that we designed our application data and UI, it is time to develop an application using XPoda Studio. Login to XPoda Studio and add a new form.
Task Management Form
Add a new form and name it "Task Management". From the toolbar add "Task Name”, "TaskList1", “NoteList”, "Task Group", "Heading", "Files", "Notes", "Description", “Deadline”, “Person”, "Status”.
Task1 Form
Firstly, we should give a name to our table and name it as “X_TASK” and also above the table name you should see the name and type in that field “Task1”.
Actions in This Field
- When the form is opened we’d like to update the whole list that should be shown in TaskList1. In order to do this, we should create a new action. When the “TaskList1” field selected you to need to click "Add New Action" to do this. Type of Action should be "When the form is opened" to handle button click. The operation will be " Update Value" because we want to update every time that opens. Also, fill up the Value area as “TaskList1”.
Task Name Field
Now, we should add a new Text Box field from the toolbox on the left side and name it as “Task Name”. What we do not need here is the right field that’d be showed in the clients’ screen. We delete the right field of the text box.
When you come on to the right pane you see the Info Text field and type in “Please type and hit enter” to be able to help whoever opens a ticket to understand what should be written.
Actions in This Field
- We would like to bring out what we search for when we type something in this field. In order to do this, we should create a new action. When the “Task Name” field selected, you should be able to see the actions icon on the Right-Side Pane. Select form, from Property Pane, click "Add New Action". Type of Action should be " When the value changes" to handle button click. The operation will be " Search in List".
TaskList1 Field
Continue adding a Grid List and name it as “TaskList1” in order to show off all the projects assigned by someone. Use this query;
SELECT
X_TASK.UserTableID,
XPODA_CLIENT_USERS.UserFullName AS Person,
X_TASK.Task, X_TASK.TaskGroup,
X_TASK.Description, X_TASK.Deadline,
X_TASK.Status
FROM
dbo.X_TASK WITH (NOLOCK) LEFT OUTER JOIN
dbo.XPODA_CLIENT_USERS WITH (NOLOCK) on
X_TASK.Person = XPODA_CLIENT_USERS.UserID
Actions in This Field
Action 1: When the form is opened we’d like to open the whole form that should be shown in TaskList1. In order to do this, we should create a new action. When the “TaskList1” field selected you need to click "Add New Action" to do this. Type of Action should be " When the row is changed" to handle button click. The operation will be " Update Value" because we want to update every time that opens. Also, fill up the Value area as “All Forms”. For this to work we should add this query here;
Select '$PUserTableID$’ as UserTableID
then please don’t forget to hit the save button on the same pane and on the top of the software to save everything in the form.
Action 2: When the row is changed we’d like to clarify if there is any content on the screen that should be shown on TaskList1. In order to do this, we should create a new action. When the “TaskList1” field selected you need to click "Add New Action" to do this. Type of Action should be " When the row is changed" to handle button click. The operation will be "Clear Content" because we want to update every time that opens. Also, fill up the Fields area as “Clear Content”.
then please don’t forget to hit the save button on the same pane and on the top of the software to save everything in the form.
Action 3: When the row is changed we’d like to update the NoteList which is the second list on the right side. In order to do this, we should create a new action. When the “TaskList1” field selected you need to click "Add New Action" to do this. Type of Action should be " When the row is changed" to handle button click. The operation will be "Update Value", Description as “UpdateNote” and, Heading as “UpdateNote”. Also, fill up the Value area as “NoteList”.
then please don’t forget to hit the save button on the same pane and on the top of the software to save everything in the form.
Action 4: When the form is opened we want to show off the actions that related to that field. In order to do this, we should create a new action. When the “TaskList1” field selected you to need to click "Add New Action" to do this. Type of Action should be " When double-clicked on row" to handle button click. The operation will be "Update Value". Also, fill up the Value area as “TaskList1”.
then please don’t forget to hit the save button on the same pane and on the top of the software to save everything in the form.
Note List Field
Now we want to show off the project that is submitted by someone. In order to do that we need to another Grid List from the toolbox and name it as “NoteList”. In query box enter following query;
SELECT
XPODA_CLIENT_USERS.UserImage AS Photo,
XPODA_CLIENT_USERS.UserFullName AS Person,
X_NOTES.Note
FROM
dbo.X_NOTES WITH (NOLOCK) LEFT OUTER JOIN
dbo.XPODA_CLIENT_USERS WITH (NOLOCK) on
X_NOTES.CreateUser = XPODA_CLIENT_USERS.UserID
WHERE
X_NOTES.TaskID = '$PUserTableID$'
Actions in This Field
- We would like to link to list and we want to show off what we search for in the NoteList, when we click any tab in the first list. In order to do this, we should consider the action that has already written in the form itself. We need to create a new action. When the “NoteList” field selected, you should be able to see the actions icon on the Right-Side Pane. Select form, from Property Pane, click "Add New Action". Type of Action should be " When the row is changed" to handle button click. The operation will be " Update Value", Description as “UpdateNote”, Heading as “UpdateNote” and Value Area should be chosen as “NoteList”.
Task Group Field
Now we’re going to add a Drop Down Box to pull the data out of our database. First, add a drop-down box and name it as “Task Group” in both fields. In order to pull out the data from our database. When “Task Group” clicked you should switch the field type to SQL Query. In query box enter following query;
SELECT
X_TASK.Heading,
X_TASK.Heading
FROM
dbo.X_TASK WITH (NOLOCK)
Heading Field
After that, we continue adding the Text Box and name it as “Heading” to give the issue/request a name and add another Text Box and name it as “Description” to be able to explain the issue and/or request.
Files Field
We may want to identify the issue with the files (images, docs, etc.) and make our issue/request more understandable. In order to do that we should add the “Add File” field from the left side pane and name it as “Files” in both fields.
Notes Field
With that being said, any type of information related to the project we may want to add some notes in our form to be more understandable. In order to do that, we need to add a Text Box and name it as “Notes” in the left-field (to be saved in our database). What we do not need here is the right field that’d be showed in the clients’ screen. We delete the right field of the text box.
Description Field
In order to explain what the project and/or issue/request about. To be able to do this we need to add a Text Box in the form and name it as “Description.”
Deadline Field
We also need to give the deadline to the project and in order to do that; we add a Date field from the toolbox on the left pane and name it as “Deadline”.
Person Field
We do need to identify the person whoever opens the ticket. In order to do that, we add a Text Box field and name it as “Person” in both fields. Use this query;
SELECT
XPODA_CLIENT_USERS.UserID,
XPODA_CLIENT_USERS.UserFullName
FROM
dbo.XPODA_CLIENT_USERS WITH (NOLOCK)
Status Field
After all, we want to know the status of the project and share the status with the other team members or project manager. In order to do that, from the left side pane we add a Drop Down Box and name it “Status” in both fields. Use these values;
New
In Progress
Done
Canceled
Buttons
“Save” Button
After we filled up the form and explained our request/issue we need to save the form to be able to see by any member of the project or project manager. In order to do that we need to add a Save button from the left side pane and name it as “Save”. Now, we should add a new action to make the button work. While this button selected, from Actions pane (Right Side Pane), select Add New Action and select Type of Action value as "When selected" and Operation value as “Save” then save the action. Also, hit the Save icon to save everything created in the form.
Actions in This Field
- We want to save everything we typed in the form when the “Save” button clicked. In order to do this, we should create a new action. When the “Save” button selected, you need to click “Add New Action” to do this. Type of Action should be "When clicked" to handle button click. Operation will be "Save".
(then please don’t forget to hit save button on the same pane and on the top of the software to save everything in the form.)
“New” Button
In order to add a new project and/or issue/request, we should create a new button. To be able to do this, we select the button field from the left side pane and name it as “New”. Now, we should add a new action to make the button work. While this button selected, from Actions pane (Right Side Pane), select Add New Action and select Type of Action value as "When selected" and Operation value as “New” then save the action. Also, hit the Save icon to save everything created in the form.
Actions in This Field
- We want to save everything we typed in the form when the “New” button clicked. In order to do this, we should create a new action. When the “New” button selected, you need to click “Add New Action” to do this. Type of Action should be "When clicked" to handle button click. Operation will be "New".
(then please don’t forget to hit save button on the same pane and on the top of the software to save everything in the form.)
“Submit” Button
After we complete the form we want to submit it and we need to create a new button. To be able to do this, we select the button field from the left side pane and name it as “Submit”.
Actions in This Field
Action 1: We want to operate a validation when this button clicked. We always want to be making sure if the record is chosen or not. In order to do this, we should create a new action. When the “Submit” button selected, you need to click “Add New Action” to do this. Type of Action should be "When clicked" to handle button click. The operation will be "Validation" because we don’t want anything to come up on the screen if nothing selected. For this to work we should add this query here;
SELECT CASE WHEN '$PUserTableID$’ = '' THEN 0 ELSE 1 END
(then please don’t forget to hit save button on the same pane and on the top of the software to save everything in the form.)
Action 2: We want to open a linked form when this button clicked. In order to do this, we should create a new action. When the “Submit” button selected, you need to click “Add New Action” to do this. Type of Action should be " When clicked" to handle button click. The operation will be "Open Form (Linked)”, Condition as “In New Window”. In addition to this Project Field should be chosen as “Task Management” and Form field as “Note” because we want to identify which task should be chosen from the second form(NOTE). For this to work we should add this query here;
UserTableID|0|TaskID
Notes|0|Note
(then please don’t forget to hit save button on the same pane and on the top of the software to save everything in the form.)
Action 3: We want to run an action when this button clicked to update the NoteList which is the second list on the right side. In order to do this, we should create a new action. When the “Submit” button selected, you need to click “Add New Action” to do this. Type of Action should be chosen “When clicked”, and Operation should be chosen as “Run Action”. You also need to choose an action “TaskList1 | UpdateNote”.
(then please don’t forget to hit save button on the same pane and on the top of the software to save everything in the form.)
Finally, we completed our application. Click "Run" to see your application.
