Versions Compared
compared with
Key
- This line was added.
- This line was removed.
- Formatting was changed.
Service Catalog offers forms that allow users to submit service requests.
Generally, a request form page consists of the following elements:
- The <breadcrumbs> widget allows navigating within the Portal pages structure.
- The <sidemenu> widget adding a sidemenu.
- The service request form itself.
>> screenshot <<
Breadcrumbs
widgetconfiguration
To configure breadcrumbs correctly, it is preferable to use the attribute values as in the example below (type these values in the Template field of the <breadcrumbs> widget form):
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
<div class="portal__breadcrumbs customized"> <breadcrumbs> </div> |
After that, you can define the breadcrumbs view in the CSS field of this form:
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
.customized { font-family: Tahoma,Verdana,Segoe,sans-serif; } |
Sidemenu
widgetconfiguration
To configure a <sidemenu> widget, use the example below as a pattern:
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
<SideMenu parentsDepth="1" childrenDepth="1" includeCategories="1" includeItems="1">\ </SideMenu> |
Service Catalog
form widget configurationform configuration Anchor request form request form
request form | |
request form |
...
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
<div simple-if = {data.ok} class ="catalog__record"> <div simple-if="{data.sizeDesktop}"> <div class="body"> <div id="recordContent"> <div class="recordTitle">{data.headerTitle}</div> <div class="recordType">{data.headerTypeText}</div> <div class="recordDescription">{data.headerDescription}</div> </div> <div class="recordIcon"><img width="176" height="176" alt ='' src={data.headerPhoto}></img></div> </div> <div class ="recordBorder"></div> </div> <div simple-if="{data.sizeMobile}"> <div class="mobile-recordIcon"><img width="112" height="112" alt ='' src={data.headerPhoto}></img></div> <div class="mobile-recordContent"> <div class="mobile-recordTitle">{data.headerTitle}</div> <div class="mobile-recordType">{data.headerTypeText}</div> <div class="mobile-recordDescription">{data.headerDescription}</div> <div event-click="s_widget_custom.readMore()" class="mobile-recordDescription__readMore" simple-if ={data.descriptionReadMore}> {data.readMoreText} </div> </div> </div> <Form tableName="{data.table}" view="options.view" save="{data.Save}" uiActions="options.uiActionsOn" userScripts="options.clientScriptsOn" ></Form> </div> <div simple-if = {data.error} class ="catalog__record"> <div class = catalog__record-error> Exception: {data.exceptions} </div> </div> <div simple-if={data.afterSave} class ="catalog__record-aftersave"> <div class="catalog__record-aftersave-icon"></div> <div class="catalog__record-aftersave-title"> {data.requestSent}</div> <div class="catalog__record-aftersave-button"> <div id="custom_button" class="catalog__record-aftersave-button-text">{data.newRequest}</div> </div> <div class="catalog__record-aftersave-link"><a href="/portal/my_tickets">{data.myTickets}<a></div> </div> |