Merge pull request #99 from funkedgeek/master

New Select tree option for hierarchical taxonomies, as asked for by issue 91

css/taxonomy.css

@@ -1,4 +1,12 @@
 li ul.rw-taxonomy-tree {
 	margin-left: 15px;
 	margin-top: 5px;
+}
+
+div.rw-taxonomy-tree.active{
+	display:inline-block;	
+}
+
+div.rw-taxonomy-tree.disabled{
+	display:none;	
 }

demo/field-taxonomy.php

@@ -69,7 +69,8 @@ static function normalize_field( $field )
 				$field['field_name'] = "{$field['field_name']}[]";
 			}
 
-			if($field['options']['type'] == 'checkbox_tree'){
+			if($field['options']['type'] == 'checkbox_tree' || $field['options']['type'] == 'select_tree'){
+				$field['field_name'] = $field['field_name'] . '[]';
 				if(isset($field['options']['args']['parent']))
 				{
 					$field['options']['parent'] = $field['options']['args']['parent'];
@@ -117,6 +118,12 @@ static function html( $html, $meta, $field )
 				$elements = self::process_terms($terms);
 				$html .= self::walk_checkbox_tree($meta, $field, $elements, $field['options']['parent'], true);
 			}
+			//Select Tree
+			elseif ( 'select_tree' == $options['type'] )
+			{
+				$elements = self::process_terms($terms);
+				$html .= self::walk_select_tree($meta, $field, $elements, $field['options']['parent'], '', true);
+			}
 			// Select
 			else
 			{
@@ -147,22 +154,58 @@ static function walk_checkbox_tree( $meta, $field, $elements, $parent = 0, $acti
 			if(!isset($elements[$parent]))
 				return;
 			$terms = $elements[$parent];
-			$html    = '';
-			$hidden	 = ! $active ? ' hidden' : '';
-
-			if ( ! empty( $terms ) )
+			$hidden = ( !$active ? 'hidden' : '' );
+
+			$html = "<ul class = 'rw-taxonomy-tree {$hidden}'>";
+			foreach ( $terms as $term )
 			{
-				$html = "<ul class='rw-taxonomy-tree{$hidden}'>";
-				foreach ( $terms as $term )
-				{
-					$checked = checked( in_array( $term->slug, $meta ), true, false );
-					$html   .= "<li><label><input type='checkbox' name='{$field['field_name']}' value='{$term->slug}'{$checked} /> {$term->name}</label>";
-					$html   .= self::walk_checkbox_tree($meta, $field, $elements, $term->term_id, (in_array( $term->slug, $meta))) ;
-					$html   .= "</li>";
-				}
-				$html .= "</ul>";
+				$checked = checked( in_array( $term->slug, $meta ), true, false );
+				$html   .= "<li><label><input type='checkbox' name='{$field['field_name']}' value='{$term->slug}'{$checked} /> {$term->name}</label>";
+				$html .= self::walk_checkbox_tree($meta, $field, $elements, $term->term_id, (in_array( $term->slug, $meta)) && $active) . "</li>";
 			}
-
+			$html .= "</ul>";
+
+			return $html;
+		}
+
+		/**
+		 * Walker for displaying select in treeformat
+		 *
+		 * @param $meta
+		 * @param $field
+		 * @param bool $active
+		 *
+		 * @return string
+		 */
+		static function walk_select_tree( $meta, $field, $elements, $parent = 0, $parent_slug='', $active = false )
+		{
+			echo $parent;
+			if(!isset($elements[$parent]))
+				return;
+			$terms = $elements[$parent];
+			$hidden = ( !$active ? 'disabled' : 'active' );
+			$disabled = disabled($active, false, false); ;
+			$multiple = $field['multiple'] ? " multiple='multiple' style='height: auto;'" : "'";
+			$id = '';
+			if(!empty($parent_slug))
+			{
+				$id = "id='rwmb-taxonomy-{$parent_slug}'";
+			}
+			$html = "<div {$id} class = 'rw-taxonomy-tree {$hidden}'>";
+			$html .= "<select name='{$field['field_name']}'{$disabled} {$multiple}>";
+			$html .="<option value=''>None</option>";
+			foreach ( $terms as $term )
+			{
+				$selected = selected( in_array( $term->slug, $meta ), true, false );
+				$html    .= "<option value='{$term->slug}'{$selected}>{$term->name}</option>";
+			}
+			$html .= "</select>";
+			foreach ( $terms as $term )
+			{
+				$html .= self::walk_select_tree($meta, $field, $elements, $term->term_id, $term->slug, (in_array( $term->slug, $meta)) && $active) . "</li>";
+			}
+			$html .= "</div>";
+
 			return $html;
 		}
 

js/taxonomy.js

@@ -12,4 +12,16 @@ jQuery( document ).ready( function($)
 			$childList.addClass( 'hidden' );
 		}
 	} );
+
+	$( '.rw-taxonomy-tree select' ).change( function()
+	{
+		var $this = $( this ),
+			$childList = $this.parent().find( 'div.rw-taxonomy-tree' ),
+			$value = $this.val();
+		$childList.removeClass('active').addClass('disabled').find('select').each(function(){
+			$(this).val($('options:first', this).val()).attr("disabled", "disabled")
+		});
+		$childList.filter('#rwmb-taxonomy-' + $value).removeClass('disabled').addClass('active').children('select').removeAttr('disabled');
+
+	} );
 } );