Different subsets of a selection custom field

Question

I have a select custom field for 'Accommodation' showing the options available for participants in events' registration form. To simplify, lets say there are 10 different accommodation options, 'option 1' until 'option 10'. It gets complicated when each of the different events (around 100 different events) have a different subset of those options, and not all 10 options are available for each event. So event A has options 1,2,3, event B has 2,3,5,7, and event C has all 10 options available.

I created a custom field for each subset of options, but came to a point of having almost 20 different custom fields called accommodation, and then trying to draw up a report of all participants from all events, showing which accommodation option they chose - is just a big mess with 20 custom fields that do not intersect.

My question is how to have only one custom field with all 10 options, but then to somehow specify for each event which out of the 10 options should be displayed and available for choice, for that particular event.

Answer 1

To do this via webform_civicrm

Download and enable webform_civicrm and read the documentation.

Google for some answers on SE or our blog at fuzion.co.nz/blog for some explanations about doing Events via webform_civicrm eg

https://www.fuzion.co.nz/blogs/registering-multiple-people-multiple-events

https://civicrm.stackexchange.com/questions/tagged/webform-civicrm

How can I create early bird fees with Webform CiviCRM?

Calculated member fees

Answer 2

I did it with javascript:

CRM/Event/Form/Registration/Register.tpl (custom_209 is the custom field attached to the event configuration page, to show which accommodation options should be valid for this event, out of the field 209 which has ALL possibilities) -

<div style="display:none;" id="event_accommodation">
    {crmAPI var='result' entity='Event' action='getsingle' return='custom_209' id=$event.id}
    {foreach from=$result.custom_209 item=value key=field}{$value},{/foreach}
</div>

And then in a custom .js file in the registration form itself:

const ID_HIDDEN_DIV_EVENT_ACCOMMODATION_VALID_OPTIONS = 'event_accommodation'; // This is set in the CRM/Event/Form/Registration/Register.tpl

function hideInvalidAccommodationOptions()
{
    if (jQuery("input[name='" + CUSTOM_FILED_EVENT_ACCOMMODATION + "']").length == 0)
    {
        // There is not accommodation field in this form. Could be an online course or a different type of seminar.
        return;
    }

    var validAccOptionsString = jQuery('#' + ID_HIDDEN_DIV_EVENT_ACCOMMODATION_VALID_OPTIONS).text().trim();

    if (validAccOptionsString.length == 0)
    {
        // No accommodation specification were set for this event
        return;
    }

    // Remove the last comma (,) from the string
    validAccOptionsString = validAccOptionsString.slice(0,-1);

    var validAccOptionsArr = validAccOptionsString.split(',');
    var accOptionsInputElementsArr = jQuery("input[name='" + CUSTOM_FILED_EVENT_ACCOMMODATION + "']");

    // Iterate through all possible accommodation input elements
    jQuery.each(accOptionsInputElementsArr, function(i, accOptionInputElement)
    {
        var $accOptionInput = jQuery(accOptionInputElement);

        // If the input element's value is not found in the specified event accommodation options
        if (jQuery.inArray($accOptionInput.attr("value"), validAccOptionsArr) == -1)
        {
            // Go up twice in the DOM from the input, to the td, to the tr, and remove the whole tr from the DOM.
            $accOptionInput.parent().parent().remove();
        }
    });
}