Topic: Autocomplete with object
josefranco pro asked 6 years ago
Good morning.
I'd like to modify the mdb-autocomplete function in order to work with object properties instead strings. I get the object from an associative array from a query with the terms of search and then I use json_encode.
The object has two properties, value and text. I wand to display the text in a link that will send the value of the object. Something like this in line 33 of mdb-autocomplete.js:
let option = $(`<li><a href="target.php?id=${data[item.value]}">${data[item.text]}</a></li>`);
Mikołaj Smoleński staff answered 6 years ago
Hello,
I've prepared autocomplete with objects snippet especially for You.
https://mdbootstrap.com/snippets/jquery/mikolaj-smolenski/162961
Best Regards
josefranco pro commented 6 years ago
Thank you very much.
I download the snippet and it works, I'm able to search a display the results, but I'm stuck trying to send the value of the text to another page.
In the snippet on modules folder, the file mbd-autocomplete.js has the next instruction: var option = $("<li>".concat(data[item], "</li>"));
I'm trying to put a link within the li element with the value of the text showed: var option = $("<li><a href='target.php?id=XXXXXXXX' >".concat(data[item], "</a></li>"));
Where XXXXX is the value I want to send.
Mikołaj Smoleński staff commented 6 years ago
I'm not sure what is Your problem. You get the value like this in the snippet:
let value = search.find(x => x.text === $(this).html()).value;
Then You can do whatever You want with it, including addition to the link.
Best Regards
josefranco pro answered 6 years ago
I made it this way. I use for searching users, and send the data to a php page that receives the the parameter id usig the GET/REQUEST method.
while ($row = mysqli_fetch_array($sql))
{
$json[] = array('value' => $row['xxx'], 'text' => "<a href='zzzzz.php?id=" . $row['xxxx'] . "'>" .$row['name'] . " " . $row['surname'] . "</a>");
}
var search = <?php echo json_encode($json); ?>;
And then the code of the snippet and replace mdb_autocomplete.js with the mdb_autocomplete.js included when you download the snippet.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.5.10
- Device: PC
- Browser: Chrome
- OS: Mint
- Provided sample code: No
- Provided link: No