[migxdb] How to have dynamic listbox options based on other listbox option selection

Support
1

Summary

I am trying to find a way to create nested listboxes where the second listbox will display its options based on what is selected on the first lisbox, but I was not able to find any similar use case.
Checked on the file migxformlayouts.config.inc.php, but didn’t find anything that could be used for this particular situation.

Step to reproduce

Here is the config json with the particular example I am trying to create;

{
  "MIGX_id":1,
  "caption":"Data",
  "print_before_tabs":"0",
  "fields":[
    {
      "MIGX_id":1,
      "field":"author",
      "caption":"Author",
      "description":"Select an author",
      "description_is_code":"0",
      "inputTV":"",
      "inputTVtype":"listbox",
      "validation":"required",
      "configs":{
		"allowBlank":"false",
		"listWidth":"",
		"title":"",
		"typeAhead":"false",
		"typeAheadDelay":"250",
		"listEmptyText":"",
		"stackItems":"false"
	  },
      "restrictive_condition":"",
      "display":"",
      "sourceFrom":"config",
      "sources":"",
      "inputOptionValues":"@SELECT '-' AS `author` UNION ALL (SELECT `name` AS `author`, id FROM `[[+PREFIX]]authors` WHERE `published` = 1)",
      "default":"",
      "useDefaultIfEmpty":"0",
      "pos":1
    },
    {
      "MIGX_id":2,
      "field":"book",
      "caption":"Choose a book",
      "description":"Choose a book from the selected author on the previous box",
      "description_is_code":"0",
      "inputTV":"",
      "inputTVtype":"listbox",
      "validation":"required",
      "configs":"",
      "restrictive_condition":"",
      "display":"",
      "sourceFrom":"config",
      "sources":"",
      "inputOptionValues":"@SELECT '' AS `book` UNION ALL (SELECT `[[+PREFIX]]books`.`name` AS `book`, `[[+PREFIX]]books`.`id` FROM `[[+PREFIX]]books` INNER JOIN `[[+PREFIX]]authors` ON `[[+PREFIX]]authors`.`id` = `[[+PREFIX]]books`.`author_id` WHERE `[[+PREFIX]]books`.`published` = '1' AND `[[+PREFIX]]authors`.`published` = '1' AND `[[+PREFIX]]authors`.`id` = '[[+author]]' ORDER BY `[[+PREFIX]]books`.`id` DESC)",
      "default":"",
      "useDefaultIfEmpty":"0",
      "pos":2
    }
  ],
  "pos":1
}

The SQL is working. I tested this filling in an ID by hand simulating the author, and worked properly.

Observed behavior

When selecting an option on the first lisbox, the second box is not updated.

Expected behavior

Maybe this already exists, but I was not able to find this information, but maybe there is an option to enable listbox dependencies.

Environment

MODX 2.7.1 with Migx 2.12.0-pl

Thank you in advance for your help.

2

there is https://modx.com/extras/package/dynamicdropdowntv

3

Hi Bruno,

Thanks for the tip. I was able to find this extra of yours but I couldn’t get it to work. I am a bit loss I must confess. Do you have any example that you can share? Even if it is completely different from the use case I shared here, not a problem.

Many thanks in advance once again

4

Hi Bruno,

I am still fighting with this, but no success.

{
  "MIGX_id":1,
  "caption":"Data",
  "print_before_tabs":"0",
  "fields":[
    {
      "MIGX_id":1,
      "field":"author",
      "caption":"Author",
      "description":"Select an author",
      "description_is_code":"0",
      "inputTV":"",
      "inputTVtype":"dynamicdropdown",
      "validation":"required",
      "configs":{
		"allowBlank":"false",
		"listWidth":"",
		"title":"",
		"typeAhead":"false",
		"typeAheadDelay":"250",
		"listEmptyText":"",
		"stackItems":"false",
		"name":"author",
		"group":"AuthorsBooksOptions",
		"packagename":"authors_books",
		"classname":"Authors",
		"idfield":"id",
		"namefield":"name"
	  },
      "restrictive_condition":"",
      "display":"",
      "sourceFrom":"config",
      "sources":"",
      "inputOptionValues":"@SELECT '-' AS `author` UNION ALL (SELECT `name` AS `author`, id FROM `[[+PREFIX]]authors` WHERE `published` = 1)",
      "default":"",
      "useDefaultIfEmpty":"0",
      "pos":1
    },
    {
      "MIGX_id":2,
      "field":"book",
      "caption":"Choose a book",
      "description":"Choose a book from the selected author on the previous box",
      "description_is_code":"0",
      "inputTV":"",
      "inputTVtype":"dynamicdropdown",
      "validation":"required",
      "configs":{
		"allowBlank":"false",
		"listWidth":"",
		"title":"",
		"typeAhead":"false",
		"typeAheadDelay":"250",
		"listEmptyText":"",
		"stackItems":"false",
		"name":"book",
		"group":"AuthorsBooksOptions",
		"packagename":"authors_books",
		"classname":"Books",
		"idfield":"id",
		"namefield":"name",
		"parents":"author",
		"clearOnRefresh":"true",
		"where":{"author_id":"[[+author:default=`999999999999999`]]"}
	  },
      "restrictive_condition":"",
      "display":"",
      "sourceFrom":"config",
      "sources":"",
      "inputOptionValues":"@SELECT '' AS `book` UNION ALL (SELECT `[[+PREFIX]]books`.`name` AS `book`, `[[+PREFIX]]books`.`id` FROM `[[+PREFIX]]books` INNER JOIN `[[+PREFIX]]authors` ON `[[+PREFIX]]authors`.`id` = `[[+PREFIX]]books`.`author_id` WHERE `[[+PREFIX]]books`.`published` = '1' AND `[[+PREFIX]]authors`.`published` = '1' AND `[[+PREFIX]]authors`.`id` = '[[+author]]' ORDER BY `[[+PREFIX]]books`.`id` DESC)",
      "default":"",
      "useDefaultIfEmpty":"0",
      "pos":2
    }
  ],
  "pos":1
}

By reading the extra PHPs, I could not find a proper way to use it on Migx, so I am improvising a bit based on the form input names from the extra source code.

If I create the TVs, I am able to use them on the frontend properly, but on Migx it is a real struggle.

Since you are the coder of Migx and dynamicdropdowntv, do you think these two can be integrated?
I am assuming that I can, as I could use colorpicker successfully as inputTVtype.

Cheers and many thanks once again
J.Nogueira

5

Hi @bruno17,
I insisted again, but no go. Can you give me just a hint of what I might be doing wrong?
Cheers and thanks again for your time.

6

Usually, I create them as TVs and use inputTV instead inputTVtype. Never tried the dynamicdropdowns with inputTVtype

7

Hi Bruno,

Thanks, no worries. I will try a bit more to see what I can get. If I am able to have a result I will share

Cheers

8

Hi Bruno,

As promised, here is my feedback:
inputTVtype does not work, unfortunately. All the confiig option names and values were checked on the site_tmplvars table on the database to be sure that the option names and option values were correct. Even though everything was correct, the only thing I get is a blank field breaking the tabs of Migx, and no conclusive message seen when debug was enabled.

Ended up following your suggestion:
When I created the TVs and assigned them as InputTV as you suggested, all went just fine and working as expected.

Many thanks for your time once again.

9

This topic was automatically closed 2 days after discussion ended and a solution was marked. New replies are no longer allowed. You can open a new topic by clicking the link icon below the original post or solution and selecting “+ New Topic”.