Welcome, Guest
Username: Password: Remember me

TOPIC: Ajax Cascading combobox

Ajax Cascading combobox 24 Mar 2019 00:39 #15689

  • Nicolas
  • Nicolas's Avatar
  • Offline
  • Premium Member
  • Posts: 82
  • Thank you received: 12
  • Karma: 6
hello cooks

I am looking for how to filter a combobox by another.
I have a subcategory table with a category FK.

I would like that when the category combobox is populated the sub category be filtered according to category

How to proceed ?

thank you in advance
Last Edit: 23 Apr 2019 22:27 by Nicolas.
The administrator has disabled public write access.

Ajax Cascading combobox 09 Apr 2019 22:50 #15710

  • Nicolas
  • Nicolas's Avatar
  • Offline
  • Premium Member
  • Posts: 82
  • Thank you received: 12
  • Karma: 6
hello everyone

It's good I found how to do it.
I was trying to filter by ID, but it did not work. i have to inform an Ajax instance and ordering by name,

I have another problem ... When I select a category, all sub categories are displayed. Is this normal or have I forgotten something?
All my sub_cat have an FK to catégorie


Thanks in advance
Last Edit: 23 Apr 2019 22:27 by Nicolas.
The administrator has disabled public write access.

Ajax Cascading combobox 14 Apr 2019 23:09 #15717

  • Nicolas
  • Nicolas's Avatar
  • Offline
  • Premium Member
  • Posts: 82
  • Thank you received: 12
  • Karma: 6
Hello cooks

Nobody can help me ?

I do not understand why all the subcategories are displayed.
The combobox "subcategory" is not filtered by the first "category".

I could do it in raw, but I prefer to do it properly in the way proposed by Jcook

In the category view.html.php I have this :
	protected function displayAjax($tpl = null)
	{
		$jinput = JFactory::getApplication()->input;
		$render = $jinput->get('render', null, 'CMD');
		$token = $jinput->get('token', null, 'BASE64');
		$values = $jinput->get('values', null, 'ARRAY');



		switch($render)
		{
			case 's_cat':

				$model = $this->getModel();
				$model->addSelect('a.nom');
				$items = $model->getItems();


				$selected = (is_array($values))?$values[count($values)-1]:$values;

				$ajaxNamespace = "maintenance.souscategories.ajax.s_cat";
				$wrapper = "_ajax_souscategories_$render";

				$event = 'jQuery("#__ajx_sous_categorie").val("");'
						.	'if(this.value != ""){'
						.		'jQuery("#' . $wrapper . '").jdomAjax({namespace:"' . $ajaxNamespace . '", vars:{"filter_categorie":this.value}})'
						.	'}else{'
						.		'jQuery("#' . $wrapper . '").innerHTML = "";'
						.	'}';

				echo '<div class="ajaxchain-filter ajaxchain-filter-hz">';
					echo JDom::_('html.form.input.select', array(
						'dataKey' => '_sous_categorie_categorie',
						'dataValue' => $selected,
						'domClass' => 'validate[required]',
						'labelKey' => 'nom',
						'list' => $items,
						'listKey' => 'id',
						'nullLabel' => 'MAINTENANCE_FILTER_NULL_CATEGORIE',
						'selectors' => array(
								'onchange' => $event
							)
						));
				echo '</div>';

				//Ajax chain on load -> Follows the values
				echo JDom::_('html.form.input.ajax.chain', array(
					'ajaxWrapper' => $wrapper,
					'ajaxContext' => $ajaxNamespace,
					'ajaxVars' => array(
									'filter_categorie' => $selected,
									'values' => $values),
					'ajaxToken' => $token,

				));


				//Wrapper Div
				echo("<div id='" . $wrapper ."' class='ajaxchain-wrapper ajaxchain-wrapper-hz'></div>");
				break;
		}

		exit();
	}

Dans le second souscatégorie viws.html.php i have :
	protected function displayAjax($tpl = null)
	{
		$jinput = JFactory::getApplication()->input;
		$render = $jinput->get('render', null, 'CMD');
		$token = $jinput->get('token', null, 'BASE64');
		$values = $jinput->get('values', null, 'ARRAY');



		switch($render)
		{
			case 's_cat':
			/* Ajax Chain : Sous-Catégorie > Nom
			 * Called from: view:ticket, layout:modify
			 * Group Level : 0
			 */
				$model = $this->getModel();
				$model->addSelect('a.nom');
				$items = $model->getItems();


				$selected = (is_array($values))?$values[count($values)-1]:$values;



				$event = 'jQuery("#jform_sous_categorie").val(this.value);';

				echo '<div class="ajaxchain-filter ajaxchain-filter-hz">';
					echo '<div class="separator">';
						echo JDom::_('html.form.input.select', array(
							'dataKey' => '__ajx_sous_categorie',
							'dataValue' => $selected,
							'domClass' => 'validate[required]',
							'labelKey' => 'nom',
							'list' => $items,
							'listKey' => 'id',
							'nullLabel' => 'MAINTENANCE_FILTER_NULL_SOUSCATEGORIE',
							'selectors' => array(
									'onchange' => $event
								)
							));
					echo '</div>';
				echo '</div>';

				break;
		}

		exit();
	}

I think everything is correct, but I do not understand why it does not work.

thank you in advance

Nicolas
Last Edit: 23 Apr 2019 22:27 by Nicolas.
The administrator has disabled public write access.

Ajax Cascading combobox 23 Apr 2019 22:50 #15727

  • Nicolas
  • Nicolas's Avatar
  • Offline
  • Premium Member
  • Posts: 82
  • Thank you received: 12
  • Karma: 6
Ok Everyone

I finally understood my mistake. I had a mistype in the filter name on my model.
So I modified
'filter' => array(
     'categorie' => array(
          'type' => 'fk'
     )
));

And everything works
The administrator has disabled public write access.
Time to create page: 0.100 seconds

Get Started