Custom Filed Renderer to render a reference as picklist on 'edit' mode and remove hyperlink on 'rea

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 = arguments[0],
value = arguments[1],
$ = 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][field.mode](field, value);

}

// If we’re in read mode, then remove hyperlink
if (field.mode !== ‘edit’) {
skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field, value);
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 = arguments[0],
value = arguments[1],
$ = 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][field.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.fieldRenderers[field.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!!