Hotel Booking
Overview
Template by Thomas antony | December 14, 2015

Online hotel booking system provides ample tolls that help hoteliers increase their online exposure and drive up revenue. One of the biggest advantages of our booking engine is the filtering of hotels with multiple criteria’s. The purpose of this template is designed to be a reference for any person wishing to implement or any person interested in the architecture of the controls for the ClaySys AppForms or how to configure the AppForms to create a hotel booking template.

On the Dashboard following functionalities are being added:-

 •   Select Location of Hotel
 • Country Automatic generate on the basis of Location
 • Select Check in and Checkout date
 • Select Rooms, Adults and Children

On clicking ‘Search’ button, following screen will be displayed

Prerequisite(s)
  • Sharepoint 2013
Search Result Form
Data Structure

Sharepoint list is used as a datasource for Sales Viewer. SharePoint lists consist of rows and columns that store data in a similar fashion to a traditional relational database management system such as SQL Server. However, a benefit of lists is that SharePoint includes Web Parts that provide simple methods for managing the data. If the data was stored in a database, it would require custom user interface components to access it and manipulate it. Also, specialized skills are required to design, implement, and maintain a custom database. Another advantage of using lists is that custom workflow and event handlers can easily be registered to them.By default ID, Title, Modified, Created, Modified By, Created By, Attachments columns are available in sharepoint list. Apart from these default list columns , user can add more columns depends on requirement.

SharePoint List
List NameColumn NameData Type

HotelDetail

'HotelDetail' list is used to display the details of hotels that user wants.

CityDetailSingle line of text
CountrySingle line of text
HotelNameSingle line of text
RatingSingle line of text
HotelLocationSingle line of text
HotelTypeSingle line of text
RateNumber
RemarksMultiple lines of text
IsActiveYes/No
CitySingle line of text
CityDetail1Single line of text
SharePoint List
List NameColumn NameData Type

HotelLocation

'HotelLocation' list is used to display the location of hotel that user wants.

CitySingle line of text
CountrySingle line of text
NoofHotelsNumber
Design And Configuration

On the Dashboard following functionalities are being added:-

• Select Location of Hotel
• Country Automatic generate on the basis of Location
• Select Check in and Checkout date
• Select Rooms, Adults and Children

On clicking ‘Search’ button, search result form will be displayed.In Search result form, following functionalities are being added:-

Can search hotels with:-

• Different rate
• Different City and Country

List Of Forms Used
NameFunctionality
HotelDashboard Form Design Rule Design 'HotelDashboard' form is used for searching hotels for booking.
SearchResult Rule Design 'SearchResult' form is used to find out hotels with different rates,city located and country.
HotelDetail Rule Design 'HotelDetail' Form is used to display details of hotel that user search using HotelDashboard form.
HotelDashboard
HotelDashboard Form Design
01
Create Form

Folders are used to store and organize forms that have a logical association or relationship. To create a new form click ‘New Folder’ button on the toolbar of the designer. On clicking the New Folder option, it will create a new folder and the name will be in the edit mode. You can type in the new name for the folder.

02
Rename Form

Then click on the ‘New Form’ link on the toolbar. Give an appropriate name for the form. Click
‘Save’ to save the form.

03
Form UI

You can drag and drop controls format the styles easily.

04
Publish Form

‘Check-In Form’ to save the changes and publish to get the completed form for the end user to use. A form must be checked-out to make modifications while all aspects of the form can be examined while checked-in.

05
Datasource Tab In Quick View

Following steps will explain about the Data Source configuration of Combo Box.Click on the Combo Box control and click the Data Sources tab to edit the Data Source.

06
List Selection

A pop-up window appears to select the item source. Select the Item Source as

‘SharePoint’. From the Data source Wizard, select respective list name and click on ‘Next’ button.

07
Criteria Builder

Clicking on the Next button opens the below screen. Fill any criteria for the combo box.

08
Selecting Value and Display member

Clicking on the Next button opens the below screen, we can select value member and
display member for the data source

09
Sorting Data

Clicking on the Next button opens the below screen, we can add trigger and comb box
sorting order. Click on ‘Finish’ button

10
Form Preview

Following data shows the combo box in preview.

11

Following steps will explain how we can configure external datasource for selecting hotel details according to the location given by user via combobox.Now let us see how we can configure the select command.First step, we need to create a datasource with suitable name and type.On next window, we have to add a Select command with suitable criteria. Then Click finish after giving proper trigger to the datasource command.

Adding Select Command
Control Mapping and Criteria
Rule Trigger
HotelDashboard Rule Design
01
Rule Name : On_FormLoad | Trigger(s) : FormLoad
Rule - On_FormLoad

Value pouplated in 'cmbcity' and 'cmbcountry'. Remove
default value of 'cmbRooms', 'cmbAdults' and 'cmbchild'. Add one day to 'dtpChkIn' date control.

02
Rule Name : On_CmbCity | Trigger(s) : CmbCity
Rule - On_CmbCity

Finding Country name and Number of locations

03
Rule Name : ToDateSetting | Trigger(s) : dtpChkIn
Rule - ToDateSetting

Adding two days to dtpchkIn and set this value to dtpChkOut

04
Rule Name : BtnSearch | Trigger(s) : BtnSearch
Rule - BtnSearch

If validation success, open resultant form

SearchResult
SearchResult Rule Design
01
Rule Name : FormLoad | Trigger(s) : FormLoad
Rule - FormLoad

Loads 'Hotel Details' form by using an external form control. Combo boxes are filling by using Filldata function

02
Rule Name : On_hdnCity | Trigger(s) : hdnCity
Rule - On_hdnCity

Loads repeating forms based on search criteria

03
Rule Name : SelectRepeat | Trigger(s) : hdnRepeatLoop
Rule - SelectRepeat

Trigger set to 'HotelDetail' form on the basis of Hotel_ID

04
Rule Name : SearchRule | Trigger(s) : btnApply
Rule - SearchRule

Hotel searching based on City and Country

05
Rule Name : RemoveRule | Trigger(s) :
Rule - RemoveRule

It will remove old repeated forms on the basis of new search criteria

06
Rule Name : RemoveRuleLoop | Trigger(s) :
Rule - RemoveRuleLoop

Part of 'RemoveRule'

07
Rule Name : On_cmbCity | Trigger(s) : CmbCity
Rule - On_cmbCity

Country value select on the basis of City combo box

08
Rule Name : SetValueToCountry | Trigger(s) : hdnSCountry
Rule - SetValueToCountry

Part of 'On_cmbCity' Rule

09
Rule Name : HomePageNavigation | Trigger(s) : btnHome
Rule - HomePageNavigation

Navigate to Home page

HotelDetail
HotelDetail Rule Design
01
Rule Name : On_hdnID | Trigger(s) : hdnID
Rule - On_hdnID

Data populated on the basis of hdnid

02
Rule Name : SetHotelNameTOHyperLink | Trigger(s) : hdnHotelName
Rule - SetHotelNameTOHyperLink

Setting hotel name to Hyperlink control

03
Rule Name : ClearRule | Trigger(s) : hdnClear
Rule - ClearRule

Clearing values on the basis of search result

Template Summary

Hotel booking are a popular method for booking hotel rooms. One of the biggest advantages of our booking engine is the filtering of hotels with multiple criteria’s. The purpose of this template is designed to be a reference for any person wishing to implement or any person interested in the architecture of the controls for the ClaySys AppForms.

How To

A how-to is an informal, often short, description of how to accomplish a specific task. A how-to is usually meant to help non-experts, may leave out details that are only important to experts, and may also be greatly simplified from an overall discussion of the topic.

  • Add Web Part

    01

    Click on Site Settings Wheel in the upper right corner of your site and then select “Site Contents Page”.

    02
    SitePages

    Select site pages or simply pages library on site content page.

    03
    Wiki Page

    Click on “new Wiki page” to add new site page.

    04
    New Page

    Give the New page name into the pop-up window and click ‘Create’ to add new page.

    05
    ClaySys HTML WebPart

    To add a new web part, click on the ‘Insert’ tab and then click on the ‘Web Part’ button. Then select ClaySys -> ClaySys HTML Web Part.

    06
    Edit The WebPart

    Click ‘Add’ button to add the Web Part. Click on the ‘edit the Webpart’ link to edit the page.

    07
    WebPart Configuration

    A new pop-up window appears and here we can configure the ClaySys AppForms by clicking on the ‘Configure’ button.

    08
    Selecting Form

    Pop-up appears with listed published forms. We can select the appropriate form by clicking on the form and add the form by clicking on the ‘Select’ button.

    09
    WebPart

    Once the configuration is finished, click on the ‘Apply’ button to see the changes. Click ‘OK’ button.

    10
    WebPart

    Now you can see the web part page you just created, as shown in the following image. Click ‘Save’ button to save the changes.

    11
    Title

    The Forms added to the WebPart may contain "Claysys HTML WebPart" as Default title. The title can be changed by editing the Title in the "Appearance" after configuring the form.

  • Import Tenant

    01
    Backup and Restore

    Click on the “Back Up and Restore” on the left side of the AppForm Designer window. Then click on ‘Import Site’ -> Browse the Tenant and click Load.

    02
    Mapping Site

    Select the ‘Zip File’ and ‘Site Name’ and click ‘Next’.

    03
    Datasource Mapping

    Click ‘Next’ button.

    04

    Click on ’Import’ button . Once it done you are free to work with the form in the new site.

    List Mapping
    Import Tenant
  • Upload List Template

    01

    On the right corner of the window, click on settings.

    02
    List Template

    Click on 'Site settings' from the drop down menu , then we can see the following window appearing.

    03
    List Template Gallery

    Click on 'List template' option as shown in the above image. And we can see 'List Template Gallery'. Click on 'Files' at the leftmost corner as shown in the following image.

    04
    Uploading Document

    Click on 'Upload Document'.

    05
    Add Template

    Following Pop up will appear where we can browse a list template stored in our computer and click 'OK' button.

    06
    Template Naming

    Following Pop up will appear where we can change the name of the List Template and enter the Description as required and click on 'Save button'.

    07
    Adding an App

    Now go to the Required sub site, click 'Settings' on the right corner (as done in step '1'). Then click on 'Site Contents'. Following Screen appears in which click on 'add an app'.

    08
    Apps

    Following screen will appear where we can type the uploaded template name and click search.

    09
    Uploaded Template

    Then you can see the Uploaded template ,Click on it .

    10
    List Naming

    On clicking it ,we will get following Pop up . Enter the name for the List template and click 'Create' button.

Downloads
No downloads has been associated with this template.

Thomas antony

Thomas Antony is an Operation (Manager) of ClaySys Technologies since 2011, AppForms product supporting firm located in Cherthala. Thomas is a graduate from Kerala University.

After graduation, Thomas joined a Natural product Exporting company, where his specialization in software development and SQL administration. That eventually led to a twelve years as a Manager (Information Technology). During that period, developed an ERP software in VB6 platform. Soon afterward, joined a software based company at Dubai as a Software Consultant. where he worked three years in different projects.

Leave a Reply