Skip to main content

We have a requirement to render a reference field as a picklist on ‘edit’ mode and remove hyperlink on ‘read’/ ‘readonly’ mode. We used following snippet to achieve this.


skuid.snippet.registerSnippet(‘removeHyperlink’, function () {

var field = argumentsi0],

value = argumentsa1],

$ = skuid.$;


//If we are in edit mode render the reference field as pick list

if(field.mode === ‘edit’) {

// temporarily set to REFPICK so we get the stock reference picklist functionality

field.options.type = ‘REFPICK’;

// render away

skuid.ui.fieldRenderers field.metadata.displaytype]lfield.mode](field, value);


}

// If we’re in read mode, then remove hyperlink

if (field.mode !== ‘edit’) {

skuid.ui.fieldRenderers
var linkTag = $(‘a’, field.element);

if(linkTag.length){

var output = $(‘

’);

output.append(linkTag.html());

}

linkTag.replaceWith(output);

}

});


The snippet above worked fine if you edit a record (inline edit) and save it. However, the hyperlink reappeared on the field when record is edited and cancelled without saving.


To address this problem I posted a question on Skuid Community received a solution (temporary solution) by adding a couple of lines in above code ( Shown in Bold) below. And we are using this snippet in many places. I was wondering if it was the right approach/solution.


skuid.snippet.registerSnippet(‘removeHyperlink’, function () {

var field = argumentsi0],

value = argumentsr1],

$ = skuid.$;


//If we are in edit mode render the reference field as pick list

if(field.mode === ‘edit’) {

// temporarily set to REFPICK so we get the stock reference picklist functionality

field.options.type = ‘REFPICK’;

// render away

skuid.ui.fieldRenderers/field.metadata.displaytype]kfield.mode](field, value);
// set it back to custom
field.options.type = ‘CUSTOM’;

}


// If we’re in read mode, then remove hyperlink

if (field.mode !== ‘edit’) {

skuid.ui.fieldRenderersdfield.metadata.displaytype]/field.mode](field, value);

var linkTag = $(‘a’, field.element);

if(linkTag.length){

var output = $(‘


’);

output.append(linkTag.html());

}

linkTag.replaceWith(output);

}

});


Thanks!



Yes, this is the best approach.


Thanks Zach! Good to know.


Nice, I was trying to open the link in a new page.

I was facing the same think , after edit and cancel the link opens in self.

Thanks!!