Skip to main content

Service Portal: add a carousel widget with fixed height and embedded homepage search


based on a copy of the ootb carousel widget

HTML:

<div class="pull-in">
  <uib-carousel interval="options.interval">
    <uib-slide ng-repeat="slide in ::data.slides" active="slide.active">
      <div class="container">
        <a href="{{::slide.url}}" title="Open carousel item">
          <img ng-src="{{::slide.background}}" style="margin:auto; width:100%;" role="presentation">
        </a>
      </div>
    </uib-slide>
     <!--homepage search-->
 <!--<div id="homepage-search" class="hidden-xs wrapper-xl">  
  <div class="wrapper-xl"> -->       
  <div id="homepage-search" class="hidden-xs wrapper-xl">  
  
    <h2 class="text-center text-4x m-b-lg sp-tagline-color" ng-bind="options.title"></h2>             
    <div ng-if="options.short_description" class="text-center h4 m-b-lg sp-tagline-color" ng-bind="options.short_description">
   </div>              
   <sp-widget widget="data.typeAheadSearch" />  
  
</div>
  <!-- homepage search end -->

  </uib-carousel>
  
  <!--<div>
    <widget id="typeahead-search"></widget>
  </div>-->
  


CSS:

div.container {
 max-height: 200px;
}

OPTION SCHEMA:

[{"name":"typeahead_search","default_value":"{title: 'How can we help?', size: 'lg', color: 'default'}","section":"Presentation","label":"Typeahead Search","type":"string"}]

SERVER SCRIPT:

data.slides = $sp.getRelatedList('sp_carousel_slide','carousel');
data.typeAheadSearch = $sp.getWidget('typeahead-search', options.typeahead_search);


Comments

Post a Comment

Popular posts from this blog

URL link in addInfoMessage

var ga=new GlideAjax('gld_HR_ajax'); ga.addParam('sysparm_name', 'checkEmployeeNumber_hrProfile'); ga.addParam('sysparm_hrprofilenumber', g_form.getValue('number')); ga.addParam('sysparm_employeenumber', newValue); ga.getXMLAnswer(function(answer) { if (answer!='undefined' && answer!=''){ var navURL="<a style='text-decoration:underline;color:blue' href=hr_profile.do?sysparm_query=number=" + answer + ">" + answer + "</a><img width='3' src='images/s.gif'/>"; var sMsg='The employee number entered already exists on another HR Profile ' + navURL; //alert(sMsg); g_form.showErrorBox('employee_number', 'error - please check'); g_form.addInfoMessage(sMsg); } });

GlideRecord setValue

setValue(String name, Object value) Sets the specified field to the specified value. Normally a script would do a direct assignment, for example,  gr.category = value . However, if in a script the element name is a variable, then  gr.setValue(elementName, value)  can be used. When setting a value, ensure the data type of the field matches the data type of the value you enter. This method cannot be used on journal fields. If the value parameter is null, the record is not updated, and an error is not thrown https://developer.servicenow.com/app.do#!/api_doc?v=madrid&id=r_GlideRecord-setValue_String_Object