Open x9sim9 opened 1 month ago
Same issue here. Select submits "data-value", which gets set to the apiFieldsMap "title" field. Cannot get select to use the ID for data-value.
In my case, API is returning array of JSON objects in the following format:
{id: "1000420", name: "FM Q3 MENS FALL 1 2025"}
The following option is set for the select:
"apiFieldsMap": { "id": "id", "title": "name" }
The result is:
<div data-value="FM Q3 MENS FALL 1 2025" data-title-value="FM Q3 MENS FALL 1 2025" data-id="1000420">
The expected/desired result would be:
<div data-value="1000420" data-title-value="FM Q3 MENS FALL 1 2025" data-id="1000420">
Or an option to have select submit "data-id" instead of "data-value"
In this setup:
The API returns an array of JSON objects, e.g., {id: "1000420", name: "FM Q3 MENS FALL 1 2025"}.
The configuration apiFieldsMap: { "id": "id", "title": "name" } maps the fields, but data-value ends up set to the title instead of the id.
Suggested Solution Add an option to allow data-value to be mapped to data-id instead of title, so that data-value reflects the id field for submissions. This would improve compatibility for cases where the id field is the preferred submit value.
Summary
The select submits the title instead of the value when using apiUrl
Steps to Reproduce
https://preline.co/docs/advanced-select.html#remote-data
Using the example provided, its setting the option values like this
<option value="Essence Mascara Lash Princess" data-id="1"
instead of like this
<option value="1" data-id="1"
Demo Link
https://preline.co/docs/advanced-select.html#remote-data
Expected Behavior
<option value="1" data-id="1"
Actual Behavior
<option value="Essence Mascara Lash Princess" data-id="1"
Screenshots