Add support for matching data attributes in show-if conditions. Also updated FieldtypeOptions to add data-if-value attribute to select <option> tags as a way use it. This attribute contains the option value (when separate option values and labels are used). This enables you to match by value rather than by option ID. Example show-if selector: colors.data-if-value=blue. Previously you could only match by option ID, i.e. colors=123. Maybe we'll add something similar for page refernce fields so that you can match by page name or path, rather than by ID.

wire/core/Field.php

@@ -1065,7 +1065,7 @@ class Field extends WireData implements Saveable, Exportable {
 			foreach(array('showIf', 'requiredIf') as $depType) {
 				$theIf = $inputfield->getSetting($depType);
 				if(empty($theIf)) continue;
-				$theIf = preg_replace('/([_.|a-zA-Z0-9]+)([=!%*<>]+)/', '$1' . $contextStr . '$2', $theIf);
+				$theIf = preg_replace('/([_|a-zA-Z0-9]+)*([-._|a-zA-Z0-9]*)([=!%*<>]+)/', '$1' . $contextStr . '$2$3', $theIf);
 				if(stripos($theIf, 'forpage.') !== false) {
 					// de-contextualize if the field name starts with 'forpage.' as used by 
 					// repeaters (or others) referring to page in editor rather than item page

wire/modules/Fieldtype/FieldtypeOptions/FieldtypeOptions.module

@@ -105,7 +105,10 @@ class FieldtypeOptions extends FieldtypeMulti implements Module {
 		if(!$inputfield) $inputfield = $this->wire()->modules->get('InputfieldSelect'); 
 		
 		foreach($this->manager->getOptions($field) as $option) {
-			$inputfield->addOption((int) $option->id, $option->getTitle()); 
+			$value = $option->value;
+			$attrs = [];
+			if($value) $attrs['data-if-value'] = $value;
+			$inputfield->addOption((int) $option->id, $option->getTitle(), $attrs); 
 		}
 	
 		if($field->get('initValue')) {

wire/templates-admin/scripts/inputfields.js

@@ -1892,8 +1892,20 @@ function InputfieldDependencies($target) {
 
 				// special case for 'count' subfield condition, 
 				// where we take the value's length rather than the value
-				if (condition.subfield == 'count') value = value.length;
-
+				if(condition.subfield == 'count') value = value.length;
+			
+				// match custom data attributes (for some types of inputs) when requested to
+				if(condition.subfield.indexOf('data-') === 0) {
+					if($field.is('select') && !$field.prop('multiple')) {
+						var v = $field.find('option[value="' + $field.val() + '"]').attr(condition.subfield);
+					} else if($inputfield.hasClass('InputfieldCheckboxes') || $inputfield.hasClass('InputfieldRadios')) {
+						// @todo
+					} else {
+						var v = $field.attr(condition.subfield);
+					}
+					if(typeof v !== 'undefined' && v !== null) value = v; 
+				}
+				
 				// if value is an object, make it in array
 				// in either case, convert value to an array called values
 				if (typeof value == 'object') {
@@ -2043,7 +2055,7 @@ function InputfieldDependencies($target) {
 
 			// separate out the field, operator and value
 			var part = parts[n];
-			var match = part.match(/^[,\s]*([_.|a-zA-Z0-9]+)(=|!=|<=|>=|<|>|%=)([^,]+),?$/);
+			var match = part.match(/^[,\s]*([-_.|a-zA-Z0-9]+)(=|!=|<=|>=|<|>|%=)([^,]+),?$/);
 			if(!match) continue;
 			var field = match[1];
 			var operator = match[2];