Convert UI Macro to Widget

[Suryansh Verma]

Hello Community,

I have created a UI Macro which is being used to upload data into MRVS from an attachment at the click of a button.

That is working fine in native view but I would like to use it on Portal as well.

Could someone point me in the right direction on how to implement this?

UI MACRO:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<input type="button" onclick="applyVariables()" value="Apply Data"/>

<script>

function applyVariables(reference) {
var cartID = g_form.getParameter("sysparm_item_guid");
var ga = new GlideAjax('global.MRVDataUtils');
ga.addParam('sysparm_name','getCSVData');
ga.addParam('sysparm_cart_id', cartID);
ga.getXML(processResponse);
}

function processResponse(response){
var answer = response.responseXML.documentElement.getAttribute("answer");
alert(answer);
g_form.setValue('list_of_participants',answer);
}

</script>
</j:jelly>

[-O-]

I cannot really say what the problem is without you sharing more information:

- the version of SN

- Script Include MRVDataUtils - or at least the part(s) relevant.

I mean I have actually crafted the widget and it does work, however I implemented a mock-up of Script Include MRVDataUtils, based on and deduced from the limited information posted by you so far.

When dealing with client-server communication it is good to share components of both parts.

[Suryansh Verma]

Here I am trying to upload data/add rows in MRVS via a CSV file attachment

Please see below:

The version of SN - Sandiego

Script Include:

var MRVDataUtils = Class.create();
MRVDataUtils.prototype = Object.extendsObject(global.AbstractAjaxProcessor, {

getCSVData: function() {
gs.info('--> MRVDataUtils: Entered');
var cartID = this.getParameter('sysparm_cart_id');
gs.info('--> MRVDataUtils: cart ID - ' + cartID);
var dataSource = this.createDataSource();

var donorTable = 'sc_cart_item';
var recipientTable = 'sys_data_source';
var recipientID = dataSource.getUniqueValue();
gs.info('--> MRVDataUtils: recipient ID - ' + recipientID);

GlideSysAttachment.copy(donorTable, cartID, recipientTable, recipientID);

var loader = new GlideImportSetLoader();
var importSetRec = loader.getImportSetGr(dataSource);
var ranload = loader.loadImportSetTable(importSetRec, dataSource);
importSetRec.state = 'loaded';
importSetRec.update();

var participantsArr = [];
var i = 0;

var importRow = new GlideRecord('u_participants_list_upload');
importRow.addQuery('sys_import_set', importSetRec.sys_id);
importRow.query();

while (importRow.next()) {

var id;

var gr = new GlideRecord('sys_user');

gr.addQuery('name', importRow.getValue('u_name_employee'));

gr.query();

if(gr.next()){

id = gr.getValue('sys_id');
}

var participantsObj = {};
participantsObj.type_of_employee = importRow.getValue('u_type_of_employee');
participantsObj.name_employee = id;
participantsArr[i] = participantsObj;

i += 1;
}

var participantsJSONString = JSON.stringify(participantsArr);
gs.info('--> MRVDataUtils: Result - ' + participantsJSONString);
return participantsJSONString;

},

createDataSource: function() {
var grDs = new GlideRecord('sys_data_source');
grDs.name = 'Particonats List Upload at: ' + new GlideDateTime();
grDs.import_set_table_name = 'u_participants_list_upload';
grDs.file_retrieval_method = 'Attachment';
grDs.type = 'File';
grDs.format = 'CSV';
grDs.header_row = 1;
grDs.sheet_number = 1;
grDs.insert();
gs.info('--> DataSource sysID is ' + grDs + ' and table val is ' + grDs.sys_class_name);
return grDs;
},

type: 'MRVDataUtils'
});

[-O- · Accepted solution]

Well, I have recreated the solution with the information provided an it did not work for me either, until I have modified the function that creates the data source by adding line:

		grDs.csv_delimiter = ',';

Without that line the system would not load the data correctly.

Here's the test CSV I have used:

Name employee,Type of employee
"Alejandro Mascall","Type 1"
"Bridget Knightly","Type 2"
"Charles Beckley","Type 1"

And here's the working result:

[Sebastian L]

You could do something in the like of this, when you add a parameter to your function "getCSVData" to parse the cartID. I assume here that the cardID is the actual sys_id of the catalog item. 

(Not tested :D) 

HTML:

<div>
<input type="button" ng-click="c.applyVariables()" value="Apply Data"/>
</div>

Server: 

var cart_id = $sp.getParameter('sys_id')

data.list_of_participants = new global.MRVDataUtils().getCSVData(cart_id); 

Client:

var myParticipants = $scope.data.list_of_participants; 

c.applyVariables = function() {
$scope.page.g_form.setValue('list_of_participants', + myParticipants);
};

[Suryansh Verma]

@Sebastian L Thank you for taking out time and providing your response.

The above implementation gives me a syntax error