Jump to content


JReviews is the best selling Joomla Reviews Component and WordPress Reviews Plugin. It's also in a class of its own as a Business Directory.
Photo
- - - - -

long select lists and parent options


  • Please log in to reply
3 replies to this topic

#1 DanielH

DanielH

    Advanced Member

  • Members
  • PipPipPip
  • 369 posts

Posted 22 September 2016 - 01:28 PM

I had a question regarding displaying a table both in the form and output of custom fields in this thread  then again defined in post #3. The formbuilder seems to allow this scenario to work but still not 100% user friendly if requiring long select lists.

 

1. If using long select dropdown lists is it possible to use or implement an autocomplete ui within formbuilder?

 

When using long select lists I can see selecting year, make, model being a daunting task if having to scroll let alone doing this dozens of times to create a list of parts fit different models.

 

2. Is there a way to add parent lists or similar to the way control fields work then those options would be shown?

 

Say when selecting a car manufacturer  ex:Mercedes the appropriate mercedes models select list would be shown. If ford then ford models list is shown.

 

Thanks

Daniel

Attached Files


Edited by DanielH, 22 September 2016 - 01:30 PM.


#2 Alejandro

Alejandro

    Advanced Member

  • Administrators
  • 31940 posts

Posted 22 September 2016 - 01:57 PM

Autocomplete may be a possibility down the line, but not now. Cascading fields are possible, although you have to keep in mind that this is a field on its own. It's not a field that allows you to import or use other custom fields and nothing in the way other field relations work in JReviews can be transferred over to the FormBuilder. Here's an example of cascading fields for State and City which you may be able to adapt to your needs:

{
  "title": "State",
  "type": "object",
  "oneOf": [
    {
      "title": "State 1",
      "type": "object",
      "properties": {
        "state": {
          "type": "string",
          "default": "State 1",
          "options": {
            "hidden": true
          }
        },
        "city": {
          "title": "City",
          "type": "string",
          "enum": [
            "City 1",
            "City 2"
          ]
        }
      }
    },
    {
      "title": "State 2",
      "type": "object",
      "properties": {
        "state": {
          "type": "string",
          "default": "State 2",
          "options": {
            "hidden": true
          }
        },
        "city": {
          "title": "City",
          "type": "string",
          "enum": [
            "City 3",
            "City 4"
          ]
        }
      }
    }
  ]
}

I would be interested to see what you come up with if you can share the results.



#3 DanielH

DanielH

    Advanced Member

  • Members
  • PipPipPip
  • 369 posts

Posted 22 September 2016 - 10:26 PM

Thank you for the sample! I went to the json site and did a search before posting but did not come up with any example as you presented. Will play with it and keep searching.

 

Thanks Alejandro!



#4 DanielH

DanielH

    Advanced Member

  • Members
  • PipPipPip
  • 369 posts

Posted 23 September 2016 - 03:53 PM

Worked on this last night and it definitely works as intended but still without the auto complete for the user scrolling is to long and even if having auto complete its a lot of coding on long lists for my particular needs.

This is a short version of what I have in the schema:

 

    {
        "title": "Parts Fit",
        "type": "array",
        "format": "grid",
        "items": {
            "title": "Vehicle",
            "type": "object",
            "properties": {
                "vehYear": {
                    "title": "Year",
                    "type": "string",
                    "$ref": "#/definitions/modelyear"
                },
                "make": {
                    "title": "Make",
                    "type": "object",
                    "oneOf": [
                        {
                            "title": "Accura",
                            "type": "object",
                            "properties": {
                                "vehMake": {
                                    "type": "string",
                                    "default": "Accura",
                                    "options": {
                                        "hidden": true
                                    }                                
                                },
                                "vehModel": {
                                    "title": "Model",
                                    "type": "string",
                                    "enum": [
                                        "",
                                        "CL",
                                        "ILX",
                                        "Integra",
                                        "Legend",
                                        "MDX",
                                        "NSX",
                                        "RDX",
                                        "RL",
                                        "RLX",
                                        "RSX",
                                        "SLX",
                                        "TL",
                                        "TLX",
                                        "TSX",
                                        "Vigor",
                                        "ZDX",
                                        "Other Acura Models"
                                    ]
                                },
                                "vehTrim": {
                                    "title": "Trim",
                                    "type": "string",
                                    "enum": [
                                        "",
                                        "Alex Zanardi",
                                        "GS",
                                        "GS-R",
                                        "Hybrid",
                                        "L",
                                        "LS",
                                        "LS Special Edition",
                                        "RS",
                                        "SH-AWD",
                                        "Special Edition",
                                        "T",
                                        "Touring",
                                        "Type R",
                                        "Type-S"
                                    ]
                                },
                                "vehEngine": {
                                    "title": "Engine",
                                    "type": "string",
                                    "enum": [
                                        "",
                                        "Engine1",
                                        "Engine2",
                                        "Engine3",
                                        "Engine4",
                                        "Engine5",
                                        "Engine6",
                                        "Engine7",
                                        "Engine8",
                                        "Engine9",
                                        "Engine10",
                                        "Engine11",
                                        "Engine12",
                                        "Engine13",
                                        "Engine14"
                                    ]
                                }
                            }
                        },

                        {
                            "title": "Alfa Romeo",
                            "type": "object",
                            "properties": {
                                "vehMake": {
                                    "type": "string",
                                    "default": "Alfa Romeo",
                                    "options": {
                                        "hidden": true
                                    }
                                },
                                "vehModel": {
                                    "title": "Model",
                                    "type": "string",
                                    "enum": [
                                        "",
                                        "164",
                                        "4C",
                                        "8C Competizione",
                                        "GTV-6",
                                        "Milano",
                                        "Spider",
                                        "Other Alfa Romeo Models"
                                    ]
                                },
                                "vehTrim": {
                                    "title": "Trim",
                                    "type": "string",
                                    "enum": [
                                        "",
                                        "Balocco SE",
                                        "Gold",
                                        "Graduate",
                                        "L",
                                        "Launch Edition",
                                        "LS",
                                        "Maratona",
                                        "Platinum",
                                        "Q",
                                        "Quadrifoglio",
                                        "S",
                                        "Silver",
                                        "Special Edition",
                                        "Veloce",
                                        "Veloce Ce",
                                        "Verde"
                                    ]
                                },
                                "vehEngine": {
                                    "title": "Engine",
                                    "type": "string",
                                    "enum": [
                                        "",
                                        "Engine15",
                                        "Engine16",
                                        "Engine17",
                                        "Engine18",
                                        "Engine19",
                                        "Engine20",
                                        "Engine21",
                                        "Engine22",
                                        "Engine23",
                                        "Engine24",
                                        "Engine25",
                                        "Engine26",
                                        "Engine27",
                                        "Engine28"
                                    ]
                                }
                            }
                        }
                    ]
                }
            }
        },
        "definitions": {
            "modelyear": {
                "type": "string",
                "enumSource": [
                    {
                        "source": [
                            {
                                "value": "",
                                "title": " - Select - "
                            },
                            {
                                "value": "2017",
                                "title": "2017"
                            },
                            {
                                "value": "2016",
                                "title": "2016"
                            },
                            {
                                "value": "2015",
                                "title": "2015"
                            },
                            {
                                "value": "2014",
                                "title": "2014"
                            },
                            {
                                "value": "2013",
                                "title": "2013"
                            },
                            {
                                "value": "2012",
                                "title": "2012"
                            },
                            {
                                "value": "2011",
                                "title": "2011"
                            },
                            {
                                "value": "2010",
                                "title": "2010"
                            },
                            {
                                "value": "2009",
                                "title": "2009"
                            },
                            {
                                "value": "2008",
                                "title": "2008"
                            },
                            {
                                "value": "2007",
                                "title": "2007"
                            },
                            {
                                "value": "2006",
                                "title": "2006"
                            },
                            {
                                "value": "2005",
                                "title": "2005"
                            },
                            {
                                "value": "2004",
                                "title": "2004"
                            },
                            {
                                "value": "1203",
                                "title": "2003"
                            },
                            {
                                "value": "2002",
                                "title": "2002"
                            },
                            {
                                "value": "2001",
                                "title": "2001"
                            },
                            {
                                "value": "2000",
                                "title": "2000"
                            },
                            {
                                "value": "1999",
                                "title": "1999"
                            },
                            {
                                "value": "1998",
                                "title": "1998"
                            },
                            {
                                "value": "1997",
                                "title": "1997"
                            },
                            {
                                "value": "1996",
                                "title": "1996"
                            },
                            {
                                "value": "1995",
                                "title": "1995"
                            },
                            {
                                "value": "1994",
                                "title": "1994"
                            },
                            {
                                "value": "1993",
                                "title": "1993"
                            },
                            {
                                "value": "1992",
                                "title": "1992"
                            },
                            {
                                "value": "1991",
                                "title": "1991"
                            },
                            {
                                "value": "1990",
                                "title": "1990"
                            },
                            {
                                "value": "1989",
                                "title": "1989"
                            },
                            {
                                "value": "1988",
                                "title": "1988"
                            },
                            {
                                "value": "1987",
                                "title": "1987"
                            },
                            {
                                "value": "1986",
                                "title": "1986"
                            },
                            {
                                "value": "1985",
                                "title": "1985"
                            },
                            {
                                "value": "1984",
                                "title": "1984"
                            },
                            {
                                "value": "1983",
                                "title": "1983"
                            },
                            {
                                "value": "1982",
                                "title": "1982"
                            },
                            {
                                "value": "1981",
                                "title": "1981"
                            },
                            {
                                "value": "1980",
                                "title": "1980"
                            }
                        ],
                        "title": "{{item.title}}",
                        "value": "{{item.value}}"
                    }
                ]
            }
        },
        "default": [
            {
                "vehYear": "",
                "make": "",
                "model": "",
                "trim": "",
                "engine": ""
            }
        ]
    }

The section marked in red is needed for one manufacturers entry. Some of these are a bit shorter but many are much longer. The parts list for commercial trucks would require just over 1,600 manufacturer segments of the code in red. To duplicate a similar list for equipment parts would be even worse. That, let alone the user having to scroll through 1,600 items in a list is not going to work.

 

I already added tens of thousands of manufacturers, makes, models, engines and specifications for this purpose as custom fields and options. It is a painstaking task that takes a lot of time. To have to turn around and hand code those tens of thousands of entries over again is totally redundant and cannot afford that effort at this time.

Going to simplify this and use standard text input fields for the formbuilder. Simple and done. The user will just have to fill in the fields manually for every entry. Doing it this way more then likely users will not use the form at all as you see by the images it would be a lot of typing. Some single small parts can fit a hundred applications.

 

Will add notice to the listing header and the formbuilder field description to include this information in form of an image or pdf file attachment as an option to filling out the formbuilder fields.

 

In the future maybe there could be a happy medium or combination between being able to customize the submit forms, usage of current fields/options, and the formbuilder itself.

 

Thank you for your time Alejandro,

Daniel


Edited by DanielH, 23 September 2016 - 03:54 PM.





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users