Node.js, KendoUI and Jade - Create

You can refer my previous post here on use cases of a CRUD application.

We will be illustrating the creation of simple Jade based UI for an employee object in the following post:


extends layout
block content
            h1= "Create employee record"
            form(method='post', name='', action='/createEmployee')
                        table.form_table(cellspacing='5', cellpadding='5', border='0')
                                                tbody
                                                            tr
                                                                        td.label Employee Name:
                                                                        td
                                                                                    input(rows='5', class='k-textbox', name="employeeName")
                                                            tr
                                                                        td.label Employee Address:
                                                                        td
                                                                                    input(rows='5', class='k-textbox', name="employeeAddress")
                                                            tr
                                                                        td.label Employee Id:
                                                                        td
                                                                                    input(rows='5', class='k-textbox', name="employeeId")
                                                            tr
                                                                        td
                                                                                    br
                                                                                    input.button1(type='submit', value='create',id="createButton")


Summary of what is being done in the above CREATE UI:

1) Creating a form with form submit action to "createEmployee"

2) Creating a table with the attributes of the Employee objects.

3) Sending the data on button click as a post request.

4) The name attributes from the input type will be used in the server side to fetch this data.

For example: The employeeId will be obtained in the server side as:

"req.body.employeeId"

You can move on to the next section to see how to create the Read UI here.

No comments:

Post a Comment