new_request_page.hbs code

Code 1 - Zendesk Help Center integration

<!-- Insert this at the end of new_request_page.hbs file -->

<script>
  function initAssetsField(){
    var ezoFieldId = 'ASSET_FIELD_ID'; // enter id of field created for linked assets

    var ezoField = $("#request_custom_fields_" + ezoFieldId);

    $.getJSON("/api/v2/users/me").done(function(userData){
      var userId = userData.user.id;
      if (userId) {
        populateAssignedAssets(userId);
      }
    });

    function populateAssignedAssets(userId){
      var url = "/api/sunshine/objects/records/zen:user:" + userId + "/related/as_user_has_many_assigned_assets";
      $.getJSON(url).done(function(data){
        var select2Data = { data: [] };
        $.each(data.data, function(index, asset){
          select2Data.data[index] = { id: asset.id, text: asset.attributes.name }
        });
        ezoField.hide();
        ezoField.after("<select multiple='multiple' id='ezo-asset-select' style='width: 100%;'></select>");
        $('#ezo-asset-select').select2(select2Data);
        $('form.request-form').on('submit', function(){
          var selectedIds = $('#ezo-asset-select').val();
          if(selectedIds){
            ezoField.val(selectedIds.join(','));
          }
        });
      });
    }
  };
  
  function loadJqueryAndInitIntegration(){
  
    function loadSelect2AndInitAssetField(){
  		getScript('https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js', function() {
        initAssetsField();
      });
  	}
  
  	if (typeof jQuery == 'undefined') {
      getScript('https://code.jquery.com/jquery-3.6.0.min.js', function() {
        loadSelect2AndInitAssetField();
      });
    } else { // jQuery was already loaded
      loadSelect2AndInitAssetField();
    };
  }
  
  document.addEventListener('DOMContentLoaded', loadJqueryAndInitIntegration);
</script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet" />