How do I render different or multiple field editors in the same table column?

Custom Field Renderers are useful in many ways. One cool but perhaps overlooked feature is the ability to render any or multiple fields, not just the field defined for the table column. Taking advantage of this, you can actually branch based on the value of one field to show one of several different fields, or even concatenate multiple fields together within a single table cell.

The example below demonstrates one way you might do this. The scenario is outline in the question… based on a “type” field, display one of several “value” fields, or multiple fields comprising a single “value”.

var $ = skuid.$,
    model = arguments[0].model,
    row = arguments[0].row,
    element = arguments[0].element, mode = arguments[0].mode;

// A shortcut function to save use some complexity below
function renderField( fieldName){
    var field = new skuid.ui.Field( row, model, null, { fieldId: fieldName, register: true } ),
        value = model.getFieldValue( row, fieldName );
    skuid.ui.fieldRenderers[field.metadata.displaytype][mode]( field, value );
    return field.element;
}

var valueType = model.getFieldValue( 'TypeField__c', row );
switch ( valueType ){
    case 'Amount':
        element.append(
            $('<span>').text(' Qty: '),
            renderField( 'Quantity__c' ),
            $('<span>').text(' Rate: '),
            renderField( 'Rate__c' ) );
        break;
    case 'Date':
        element.append( renderField( 'DateValue__c' ) );
        break;
    case 'Boolean':
        element.append( renderField( 'BooleanValue__c' ) );
        break;
    case 'Text':
        element.append( renderField( 'TextValue__c' ) );
        break;
}

You can learn more about extending Skuid Table with Custom Field Renderers by reading this tutorial:

http://help.skuidify.com/m/11720/l/204496-table-component-custom-field-renderers

You can learn more about Skuid’s standard field renderers here:

http://help.skuidify.com/m/11720/l/214147-skuid-ui-field-renderers

Any idea how to make this work when one of the fields is a reference  and the other a text field?