-2

I am working on an InertiaJS project.

I have a PHP array which pass it as a prop to Vue and show it as a select box. Here's how the object is in JS:

{
  1: "Vexapa",
  5: "Linga & Satro",
  6: "Feearlees",
  7: "Abbaga, Sort and Try",
  8: "Ollwether",
  10: "Domino Effect",
  11: "Sapata",
  12: "Ankels' Camel",
  18: "Katrina SHA",
  19: "Ulusy",
  20: "Whatever"
}

I want this object sorted ascending by value, from A to Z.

I have tried other solutions like this one Sort objects in an array alphabetically on one property of the array

but nothing seem to work. Whatever I do, the moment I have to convert it to an object, the ordering goes by the key.

Even if I sort in the back-end, in the JS the object is again sorted by ID.

I know that in ES6 objects are sorted by default.

I have also tried it with lodash but with no luck.

eripanci
  • 25
  • 1
  • 5
  • If you want a sorted list use an Array. Objects in javascript [do guarantee property sort order](https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order) but that order involves sorting integer keys first in ascending order. – pilchard Jun 22 '23 at 10:26
  • objects whose keys are all numeric type will always be sorted numerically, sorting object keys is a pointless task as that's not what objects are made for – Jaromanda X Jun 22 '23 at 10:29
  • Do you want to sort the properties (keys and values) or sort the values and keep the keys? – jabaa Jun 22 '23 at 10:59

1 Answers1

0

First of all, I don't know what are you doing wrong on server side that passed data is scrambled. You should provide more details for that matter. And you should know , Js objects like this are not guaranteed to have your expected result.

Second , what ever you are doing , is not efficient or correct. Consider using arrays. In inertia, PHP arrays by default turn into js arrays.

But IF:

By Sorting Your Object You Mean This :

let result = {
  1: "Abbaga, Sort and Try",
  5: "Ankels' Camel",
  6: "Domino Effect",
  7: "Feearlees",
  8: "Katrina SHA",
  10: "Linga & Satro",
  11: "Ollwether",
  12: "Sapata",
  18: "Ulusy",
  19: "Vexapa",
  20: "Whatever"
}

it can be achieved this way :

const obj = {
  1: "Vexapa",
  5: "Linga & Satro",
  6: "Feearlees",
  7: "Abbaga, Sort and Try",
  8: "Ollwether",
  10: "Domino Effect",
  11: "Sapata",
  12: "Ankels' Camel",
  18: "Katrina SHA",
  19: "Ulusy",
  20: "Whatever"
};

// Separate keys and values into separate arrays
const keys = Object.keys(obj);
const values = Object.values(obj);

// Sort the keys and values individually
keys.sort((a, b) => Number(a) - Number(b));
values.sort();

// Create a new object by joining the sorted keys and values
const result = {};
keys.forEach((key, index) => {
  result[key] = values[index];
});

console.log(result);
Mohsen Robatjazi
  • 97
  • 11
  • Yes, but as you can see, now the IDs are not the same as in the original object. "Vexapa" which has the key 1 in the original object now has the key 19. – eripanci Jun 22 '23 at 12:08
  • @eripanci I know I mentioned it. Your question is not clear. Please provide sample of output you need and the input you have. I'll do my best to help – Mohsen Robatjazi Jun 22 '23 at 15:43
  • The input is the object I've provided. The output should be like this: { 7: "Abbaga, Sort and Try", 12: "Ankels' Camel", 10: "Domino Effect", ... , 20: "Whatever" } – eripanci Jun 23 '23 at 09:40