Hey all,
So I have an array ‘experience’ which lists a persons career history. This comes from an API and the structure is like this:
experience
etc.
What I’m trying to do is display the api results in a repeat (this works great) - but the order of the experience items in the array is not in order from the API, so I need to order them myself.
Wondering the best way to achieve this?
There are sort functions in both client & server side. Add the function to the repeat expressions itself.
Have you tried them?
EG: Client side:
EG: Server side:
I’ve gone to use those before but cant see how you choose which property to sort by or whether ASC or DESC - I’ve never seen any parameter options in the picker so I assumed it was only useful for an array not an object.
Thanks @sid - yep aware of the ‘sort’ formatter, I’ve tried this, but it just doesn’t seem to actually work on the end date field, plus as @bpj mentions - there appears no way (at least in the UI) to actually choose what to sort on.
As Sid shows, I think sort is the way to go. I just tested one and seems fine (at least with data coming from a server connect:
And I threw in the reverse method as that is how you can control ASC/DESC.
This is right. Property option is available in both server side and client side sort functions.
Hey @sid and @mebeingken - still really struggling with this.
The sort just doesn’t seem to change the order, so I’d appreciate any help debugging what is wrong and causing the sort to not work.
Here is an example of the schema I’m trying to sort on:
The data is coming from an API so I can’t use the Query Manager to sort the results. I’ve also tried to manually type in the sort. Perhaps Wappler is just seeing the date as a string, text or numbers? I’ve tried to convert to date and then sort but can’t get that working either.
Any ideas what I’m doing wrong here?
Can you share the json here as returned by api?
{
"took": 2,
"timed_out": false,
"_shards": { "total": 5, "successful": 5, "skipped": 0, "failed": 0 },
"hits": {
"total": { "value": 10000, "relation": "gte" },
"max_score": 1.0,
"hits": [
{
"_index": "...",
"_type": "_doc",
"_id": "...",
"_score": 1.0,
"_source": {
"job_company_location_name": null,
"location_continent": "...",
"location_postal_code": null,
"full_name": "...",
"job_start_date": "1990-04",
"job_last_updated": "2020-09-01",
"location_region": "...",
"twitter_url": null,
"location_names": ["..."],
"job_company_location_region": null,
"@timestamp": "2020-11-16T07:36:16.050Z",
"location_name": "...",
"experience": [
{
"title": {
"role": null,
"name": "president",
"sub_role": null,
"levels": ["cxo"]
},
"company": {
"name": "...",
"location": null,
"size": null,
"twitter_url": null,
"facebook_url": null,
"industry": null,
"linkedin_id": null,
"id": null,
"website": null,
"founded": null,
"linkedin_url": null
},
"is_primary": true,
"start_date": "1990-04",
"location_names": ["..."],
"end_date": 1994-04,
"summary": null
},
{
"title": {
"role": null,
"name": "president",
"sub_role": null,
"levels": ["cxo"]
},
"company": {
"name": "...",
"location": null,
"size": null,
"twitter_url": null,
"facebook_url": null,
"industry": null,
"linkedin_id": null,
"id": null,
"website": null,
"founded": null,
"linkedin_url": null
},
"is_primary": true,
"start_date": "1994-04",
"location_names": ["..."],
"end_date": 1998-04,
"summary": null
}
],
"job_company_linkedin_url": null,
"job_company_twitter_url": null,
"job_title_sub_role": null,
"@version": "1",
"job_company_linkedin_id": null,
"job_summary": null,
"birth_year": null,
"emails": [],
"inferred_salary": "...",
"last_name": "meister",
"middle_initial": null,
"job_company_location_geo": null,
"middle_name": null,
"version_status": {
"status": "updated",
"contains": [],
"current_version": "12.0",
"previous_version": "11.0"
},
"location_street_address": null,
"linkedin_id": "184920460",
"job_company_website": null,
"job_company_location_street_address": null,
"location_last_updated": "2020-09-01",
"location_locality": "...",
"summary": null,
"street_addresses": [],
"job_title_role": null,
"job_title_levels": ["cxo"],
"job_title": "president",
"phone_numbers": [],
"job_company_location_locality": null,
"job_company_location_address_line_2": null,
"twitter_username": null,
"location_address_line_2": null,
"gender": "male",
"regions": ["wisconsin, united states"],
"job_company_location_continent": null,
"location_geo": "...",
"facebook_url": null,
"work_email": null,
"github_url": null,
"linkedin_connections": ...,
"facebook_username": null,
"id": "...",
"inferred_years_experience": 30,
"linkedin_username": "...",
"job_company_location_postal_code": null,
"education": [],
"job_company_location_country": null,
"first_name": "scott",
"facebook_id": null,
"job_company_founded": null,
"skills": [],
"certifications": [],
"interests": [],
"job_company_industry": null,
"job_company_facebook_url": null,
"mobile_phone": null,
"location_country": "...",
"job_company_id": null,
"job_company_size": null,
"profiles": [
{
"id": "...",
"network": "...",
"username": "...",
"url": "..."
}
],
"job_company_name": "...",
"industry": "...",
"languages": [],
"countries": ["..."],
"birth_date": null,
"github_username": null,
"linkedin_url": "..."
}
}
]
}
}
apiresponse.hits.hits[0]._source.experience.sort('end_date')
This is what I tried and it seems to be working fine. If you are trying to sort the main output based on nested JSON array experience, I don’t think it will work.
And, if you wish to sort just a single experience array for any one index of hits, it should work as above.
Same should work on the client side.
Thanks @sid - I have the full array output, and I’m trying on the client side to order a single array from within the full response - and I just can’t order that specific ‘experience’ array based on the end_date. I just can’t figure out why!
I’ve tried the above but as I need the array to match the main array in the results card, I don’t see how I can get that to work
Not sure I follow what this means. Can you share the sorting code on client side which is not working for you?
Hey @sid
I just mean that in the repeat, the main source of data is data1 for example, and this experience array is within the main source of data, so data1.experience, and then the dates are nested within experience, so data1.experience.end_date. I don’t want to sort the repeat itself, but I want to sort a repeat within a card in the repeat with just experience data.
Here is what my final attempt was, I think i’ve tried every conceivable variation!
<div class="row" is="dmx-repeat" id="repeat_primary1" dmx-bind:repeat="experience.sort(experience[0].end_date)">
<div class="col-12">There should be no issue when trying to sort only the data source of the nested repeat.
dmx-bind:repeat="experience.sort('end_date')"
OR
dmx-bind:repeat="experience.sort(end_date)"
One of the two above should work.
it worked!!!! Thank you!!