Custom Field Second Dropdown Based On Previous Dropdown's Selection

[Artemis Obauldi]

I'm very new at this.

1. I'm using showcase for an RPG and would like to display "Races" and "Sub-Races" dropdown menus via Custom Fields when creating an item.

2. I would like the options of Sub-Races to change dynamically and be based upon the selection of the previous dropdown menu, Races.

3. I would like to do this via this jquery snippet I found (unless there's a better/easier way), and am wondering how I might go about using it to my advantage.

$(document).ready(function() {
$('#Rank').bind('change', function() {
var elements = $('div.container').children().hide(); // hide all the elements
var value = $(this).val();

if (value.length) { // if somethings' selected
elements.filter('.' + value).show(); // show the ones we want
}
}).trigger('change');
});

Demo Link: http://jsfiddle.net/3UWk2/1/
Stackexchange Discussion: http://stackoverflow.com/questions/...dropdown-based-on-previous-dropdown-selection

I'm assuming the Showcase Custom Field Dropdown Menu would be replacing the HTML the dude in the Stackexchange Discussion is using, so I'd be using values like $fieldID. I'm also curious what $value I'd use for the Options of the Dropdown Menus, like what's the correct syntax for fetching it.

Any help would be mucho appreciated!

 

[Bob]

That is not possible with how custom fields work. To do what you want to do would require custom development outside of custom fields (or MAJOR modification to the entire custom fields functionality). IMO, you'd be better off staying away from custom fields and extending the addon itself (much less work IMO). Either way tho requires a pretty good understanding of php/mysql & xenforo's MVC framework.

 

[0ptima]

@Artemis Obauldi Did you ever get get this implemented?

 

[0ptima]

Here is my workaround for a dynamic drop down based on a previous drop down selection

Install this addon
https://xenforo.com/community/resources/multiple-choice-fields-by-waindigo.3825/

Run the following SQL in phpMyAdmin to add a new field called multiple_choice_waindigo to the xf_nflj_showcase_custom_field

ALTER TABLE  `xf_nflj_showcase_custom_field` ADD  `multiple_choice_waindigo` TINYINT UNSIGNED NOT NULL DEFAULT  '0'

Create a new showcase drop down custom field



Create the drop down choices for the first and second drop down by separating the entries by a pipe "|".

In this example, the first drop down contains the companies Honda, BMW and Chevrolet. The second drop down will then be dynamically generated based on the company selected and will display the respective models from the selected company.
So if BMW is selected, the second drop down will contain M3, M4 and M5.



Go back to phpMyAdmin and set the multiple_choice_waindigo field in the xf_nflj_showcase_custom_field to 1

UPDATE  `showcase`.`xf_nflj_showcase_custom_field` SET  `multiple_choice_waindigo` =  '1' WHERE  `xf_nflj_showcase_custom_field`.`field_id` =  'vehicle';

When creating a new showcase only the first drop down is initially shown


Company selection



Once the company is selected, the models show up

Model has been selected


Submitted showcase item

The vehicle shows up as BMW|M5. See next post on how to remove the "|".

 

[0ptima]

The "|" separating the make and model can be removed with a template callback

In the library folder create a new folder called Custom

Create a new empty file called Showcase.php


Add the following code, which will replace the "|" with a space, to the Showcase.php file

<?php

class Custom_Showcase
{
    public static function renderVehicle()
    {
        $val = func_get_arg(1);
        return  str_replace("|"," ", $val);
    }
}

?>

Change the display location of the vehicle custom field to Self Placement


Edit the nflj_showcase_item_field_group template and add the following before the </xen:contentcheck> tag

<xen:if is="{$item.customFields.vehicle}">
    <div class="customShowcaseFields tab1">
        <dl class="customShowcaseFieldvehicle">
            <dt>Vehicle:</dt>
            <dd><xen:callback class="Custom_Showcase" method="renderVehicle"   params="{xen:helper showcaseFieldValue, $item, 'vehicle', {$item.customFields.vehicle}}"></xen:callback></dd>
        </dl>
    </div>
</xen:if>

End result

 

[Alpha1]

Conditional fields (SC & AMS)