Order Guide: Choose Options Button

harish11 · ‎06-23-2015

On the Order guide form, we have a 'choose Options' button displayed on the Top right corner. And the users need to scroll up to be able to view the 'Choose Options' button.

Is it possible to display the 'Choose Options' at the bottom of the page or have a floating 'Choose Options' button?

Ashish Kumar Ag · ‎06-23-2015

I have done the changes. You can try the below code in the UI page. Have a copy of the UI page com.glideapp.servicecatalog_cat_item_guide_view before replacing.

<?xml version="1.0" encoding="utf-8"?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<g:requires name="scripts/js_includes_catalog.js" includes="true" />

<g:requires name="styles/js_includes_catalog.css" includes="true" />

<g:requires name="styles/sc_cat_only.css" includes="false"/>

<g:inline template="sc_sanitize.xml"/>

<j2:set var="sysparm_guide" value="$[JS:sysparm_guide]" />

<g2:evaluate var="jvar_found_guide" jelly="true">

var jvar_found_guide = new GlideRecord('sc_cat_item_guide').get(jelly.sysparm_guide);

jvar_found_guide;

</g2:evaluate>

<g2:evaluate var="jvar_cat_item_authorized" jelly="true">

var answer = true;

var item = GlideappCatalogItem.get(jelly.sysparm_guide);

if (jvar_found_guide $[AMP]$[AMP] !gs.hasRole('catalog_admin'))

answer = item.canView();

answer;

</g2:evaluate>

<j2:if test="$[jvar_cat_item_authorized]">

<j2:if test="$[sysparm_guide == null || sysparm_guide == '' || !jvar_found_guide]">

<b>${gs.getMessage("Error:")}</b>

$[AMP]nbsp;${gs.getMessage('Order Guide Not Specified')}

</j2:if>

<j2:if test="$[sysparm_guide != null and sysparm_guide != '' and jvar_found_guide]">

<g2:inline template="output_messages.xml" />

<g2:evaluate var="jvar_item" jelly="true">

var initial = jelly.sysparm_initial;

var guide = '';

var active = SNC.GlideHTMLSanitizer.sanitize(jelly.sysparm_active);

var show_cart = true;

var show_tabs = true;

var c = GlideappCart.getCartForRhino();

if (initial == 'true') {

c.newGuide();

guide = jelly.sysparm_guide;

active = guide;

c.setGuide(guide);

c.setGuideActive(active);

c.update();

show_cart = false;

show_tabs = false;

} else {

// UI reflects sc_cart's opinion of the active tab

if (active == '')

active = c.getGuideActive();

else {

// sc_cart's opinion of active tab updated to reflect UI's

c.setGuideActive(active);

c.update();

}

guide = c.getGuide();

var index = c.getCrumbs().indexOf(active);

if (index > -1) {

var history = c.getCrumbHistory().get(parseInt(index));

if (history == 'Z')

history = '';

}

if (jelly.sysparm_cart_edit == 'guide_serial') {

show_tabs = false;

show_cart = false;

}

var sc_cat_item = new GlideRecord('sc_cat_item');

sc_cat_item.get(active);

active;

</g2:evaluate>

<j2:set var="sysparm_id" value="$[sc_cat_item.sys_id]" />

<j:set var="jvar_is_guide" value="true" />

<j2:set var="jvar_is_guide" value="true" />

<g:inline template="com.glideapp.servicecatalog_context_menu.xml" />

<j2:if test="$[sysparm_cart_edit != 'guide_serial']">

<j2:set var="sysparm_cart_edit" value="$[history]" />

</j2:if>

<j2:if test="$[show_tabs == true]">

</j2:if>

<j2:if test="$[show_tabs == false]">

</j2:if>

</form>

<g2:inline template="sc_header_back_button.xml" />

</td>

$[gs.getMessage('Order guide') + ' - ' + sc_cat_item.name.getDisplayValue()]

</div>

</td>

<g:inline template="com.glideapp.servicecatalog_guide_tabs_controls.xml" />

</td>

</tr>

</table>

<g:sc_banner />

<j2:if test="$[show_cart == false]">

function calcPrice() {

// this is a noop

}

addLoadEvent(function() {g_cart = new SCCart()});

</script>

</j2:if>

<j2:if test="$[show_tabs == true]">

<g:inline template="com.glideapp.servicecatalog_guide_tabs.xml" />

</j2:if>

<tr>

<td>

$[sc_cat_item.short_description.getDisplayValue()]

</td>

</tr>

<tr>

<j2:if test="$[show_cart]">

<j2:if test="$[!sc_cat_item.custom_cart.nil()]">

<j2:set var="sysparm_show_cart_guide" value="true" />

<g2:macro_invoke macro="$[sc_cat_item.custom_cart.name]" />

</j2:if>

<j2:if test="$[sc_cat_item.custom_cart.nil()]">

<g2:inline template="sc_cart_guide.xml" />

</j2:if>

<g2:evaluate var="jvar_has_image" >

var image_src = sc_cat_item.picture.getDisplayValue();

var has_image = true;

if (image_src == null || image_src == '')

has_image = false;

has_image;

</g2:evaluate>

<j2:if test="$[jvar_has_image]">

</div>

</j2:if>

<g2:no_escape>$[sc_cat_item.description.getDisplayValue()]</g2:no_escape>

</td>

</tr>

</table>

</td>

</tr>

</table>

<tr>

<g:inline template="sc_cat_item_options.xml" />

<j2:if test="$[sc_cat_item.type == 'bundle']">

<tr>

<td>

<strong>${gs.getMessage('Also includes')}</strong>

</td>

</tr>

<tr>

</tr>

<g2:evaluate var="jvar_item" jelly="true">

z = new GlideRecord('sc_cat_item_children');

z.addQuery('parent', jelly.sysparm_id);

z.orderBy('child.order');

z.orderBy('child.name');

z.query();

</g2:evaluate>

<j2:set var="jvar_start_closed" value="$[sc_cat_item.start_closed]" />

<j2:while test="$[z.next()]">

<g2:evaluate var="jvar_item"

expression="

sc_cat_item = new GlideRecord('sc_cat_item');

sc_cat_item.get(z.child);" />

<j2:set var="jvar_is_child" value="true" />

<g:inline template="sc_cat_item_options.xml" />

</j2:while>

</j2:if>

</table>

</td>

</tr>

<g:inline template="com.glideapp.servicecatalog_guide_tabs_controls.xml" />

</td>

</table>

</div>

<g2:client_script type="catalog_item" catalogItem="$[sysparm_id]" />

<j2:set var="jvar_catalog_item" value="$[sysparm_id]" />

<g:inline template="catalog_ui_policy.xml" />

</j2:if>

<j2:if test="$[!jvar_cat_item_authorized]">

Not Authorized

</j2:if>

</j:jelly>

View solution in original post

Ashish Kumar Ag · ‎06-23-2015

Hi,

com.glideapp.servicecatalog_cat_item_guide_view is the UI page.

And below is the code in UI page for the Button. You have to place this code again in the end of the UI page to have the Choose button at buttom.

<g:inline template="com.glideapp.servicecatalog_guide_tabs_controls.xml" />

</td>

abdulmominkhan · ‎08-07-2015

Hi Ashish,

Thanks for posting this solution.

Can you please let me know which UI page/UI macro used for Order summery page.

I would like to implement cancel button and place on final screen so that user can submit request or cancel order.

harish11 · ‎08-07-2015

Abdul @ If you are in the Fuji version, check Cart Layouts under Service Catalogue Module. You will find an option to add buttons and also rename them.

abdulmominkhan · ‎08-07-2015

Thank You Harish,

Your solutions helps me but not 100%. I need to disable (not remove) shipping address and requested for field from last page (checkout screen) of two step order guide. I would like to know UI macro/ UI page used to display content.