We Keep Coding

Find and match string in array object and then sort by object value. React and Javascript

i have an array of nested objects that give each user a permission.
const UserList = [{
0: {
users: {
"email": "user1#gmail.com"
},
permission: {
"id": 1,
"access": "Edit"
}
},
1: {
users: {
"email": "user2#gmail.com"
},
permission: {
"id": 2,
"access": "Read Only"
}
},
2: {
users: {
"email": "user3#gmail.com"
},
permission: {
"id": 1,
"access": "Edit"
}
},
}]
My problem: I want to be able to match a email string to the email in the object and then grab object with the access "read only'. This is all to disable a button. So if the current user's email matches one in the object and the access equals "read only" then pull it out. Im not sure if i want to create a function/prop for this condition but the disable button is in another file.
So lets say this is my email
const myEmail = user2#gmail.com. How do i compare it to UserList and create that condition above. Then transfer it to a button in another file <button disabled={solution goes here}></button>
Edit: I want to find the object that has the current users email, then if that object's access = read only, then disable.
Maybe a .include(myEmail)? Not sure
Thanks for your help!

You can use Object.values(UserList) to get an array with just the values (the user object in this case). Then you can use that list to do your rendering (seems you are using react), so you can just map over the list, and then use the information to check whether a value is `Read Only" etc.
in your HTML, that looks something like:
<button disabled={userObj.permissions.access !== "Read Only"}>
I am not quite following the question about matching email strings.

Update single object in localStorage

I want to update a single Object in my localStorage. I made a detail page, where I can submit new values (progress and value)
When I want to update the value, it changes the value in both objects. How can I change just one object.
Here is my deployment link.(its work in progress)
https://mastery-app.herokuapp.com/
This is my localStorage array:
skills[
{
"title": "Sewing",
"imageSrc": "images.unsplash.com",
"description": "Make your own clothes",
"category": "crafting",
"progress": 500,
"isDone": false,
"rank": 0,
"value": 0
},
{
"title": "Crocheting",
"imageSrc": "images.unsplash.com",
"description": "Interlock loops of yarn",
"category": "crafting",
"progress": 500,
"isDone": false,
"rank": 0,
"value": 0
}
]
This is how I update the localStorage:
const update = skills.map((skills) => {
skills.title === skills.title;
const updateProgress = skills.progress - value;
const rankNumber = parseInt(ranking);
const updateRank = skills.rank + rankNumber;
console.log(updateRank);
const updateValue = skills.value + value;
return {
title: skills.title,
rank: updateRank,
description: skills.description,
progress: updateProgress.toFixed(1),
imageSrc: skills.imageSrc,
category: skills.category,
isDone: false,
value: updateValue,
};
});
localStorage.setItem('skills', JSON.stringify(update));

You may consider using the find method to find the object you want to update. map is not the right function to be used for your use case.
Also skills.title === skills.title; has no effect at all (Maybe you wanted to use an if statement to do some kind of filtering by using title but that always would return true). Please remove that.
Now, I don't exactly know which field are you going to use to search for the object you want to update, but it has to be unique. If none of the fields in the objects are unique you should consider adding an unique id field in the skills objects. But if title is unique you can use the title to search. Then you can do something like the pseudo code below:
const toUpdate = skills.find(skill => skill.title === your_title_here)
toUpdate.field_to_update_1 = some_value_1
toUpdate.field_to_update_2 = some_value_2
localStorage.setItem('skills', JSON.stringify(skills))
Please also check the MDN docs to see how map, find and other array methods work and some of their use cases.

Adding a sharepoint list item, which has column of type "Person or Group" in it

I am trying to add an item to a list. The list has 2 columns in it: Title and recipientId (it is of type Person or Group). Now I am using
https:<site url>/_api/web/Lists/getbytitle('list name'>)/items
to create the list. Unfortunately I am unable to figure out what value I should be giving to recipientId (some blogs here mentioned we have to provide the user id. If that is right, how do I get that id or what exactly I should give there for the user to get added there?) This is the json I am using in post man to create the item:
{ "__metadata":
{
"type": "SP.Data.List3ListItem"
},
"Title": "Teams incorporate feedback"
}

If your column allow mutiple value:
{
"__metadata":{
"type":"SP.Data.TestListItem"//change this value to yours
},
"Title":"Test",
"supervisorId":{
"results":[25,26]//user ids
}
}
If your column only allow single value:
{
"__metadata":{
"type":"SP.Data.TestListItem"
},
"Title":"Test",
"supervisorId":5
}

Hopefully this might save someone's time,
so to add a value for a column of type "person or Group"(recipientId in my case). Firstly, we need to have the site users id that you can get from REST API https://<site_url>/sites/<site_name>/_api/web/siteusers. Once you have the ID, you can add it as value for "UsernameId" key value
{ "__metadata":
{
"type": "SP.Data.List3ListItem"
},
"Title": "Varun",
"UsernameId":13
}
this will add the corresponding user name to the column of type "person or Group"(recipientId in my case).

Bind dropdown to knockout value from external modal

I have a view model containing 2 arrays. One array is an array of users, and the other is an array of user levels.
{
"Users": [
{
"UserLevel": {
"Permissions": [],
"Id": 2,
"Name": "Developer",
"SortOrder": 1,
"IsHidden": false
},
"Id": 1,
"Username": "Björn Jakobsson",
"Password": null,
"Fullname": null,
"Email": "bjiorn#bjinteractive.se",
"Phone": null
}
],
"UserLevels": ko.observableArray([
{
"Permissions": [],
"Id": 1,
"Name": "Admin",
"SortOrder": 2,
"IsHidden": false
},
{
"Permissions": [],
"Id": 2,
"Name": "Developer",
"SortOrder": 1,
"IsHidden": false
}
])
}
and the drop down
<select data-bind="options: $parent.UserLevels(), optionsText:'Name', value: UserLevel" class="form-control"></select>
While editing a user from the user array i have a dropdown for choosing user level of this user wich is populated from the UserLevels array. If I choose a user level (in this case Developer) and saves the value in my database is saved and everything, and a reload of the page shows the correct value, but as soon as I choose to edit the user (using a bootstrap modal and with-data binding, the drop down automatically selects Admin (first in the array) and not Developer from my user model, and then the user model is updated since the user level of the user is bound to the drop down.

I believe your binding is incorrect. You are not binding to the observable array, but instead to what the observable array resolves to (i.e. the array)
Use
options: $parent.UserLevels
instead of
options: $parent.UserLevels()

You probably need to add an optionsValue binding.
From doc:
Typically you’d only want to use optionsValue as a way of ensuring
that KO can correctly retain selection when you update the set of
available options. For example, if you’re repeatedly getting a list of
“car” objects via Ajax calls and want to ensure that the selected car
is preserved, you might need to set optionsValue to "carId" or
whatever unique identifier each “car” object has, otherwise KO won’t
necessarily know which of the previous “car” objects corresponds to
which of the new ones.

I found a way to get around the problem with my own biding instead for value. Below is the code I use. Any drawbacks or mistace to edit? I'm pretty new to KO and still have problems sometimes when to use unwrap, unwrapobservable etc, but below code works. Ideas for improvement?
ko.bindingHandlers.valueBasedOnObject = {
init: function (element, valueAccessor, allBindings) {
var prop = allBindings().optionsValue;
var value = valueAccessor();
$(element).change(function () {
var value = $(element).val();
var selectedModel = ko.utils.arrayFirst(ko.unwrap(allBindings().options()), function (item) {
return ko.utils.unwrapObservable(item[prop]) == value;
});
valueAccessor()(selectedModel);
});
var valueUnwrapped = ko.unwrap(value);
$(element).val(valueUnwrapped[prop]);
},
update: function (element, valueAccessor, allBindings) {
/* */
}
};

How can I pass getJSON results into an input box

I'm trying to populate a from with the data from the last record in my db with $.getJSON.
The GET returns the JSON but I can't get the data to populate the fields. I'm a complete neewb to much of this.
$.getJSON("loadloads.php", function (data) {
document.getElementById("LoadNumber").innerHTML = data.LoadNumber
});
this is the JSON returned, copied from firebug.
[{
"value": {
"LoadNumber": "227303",
"OrderDate": "2013-04-09",
"ShipDate": "2013-04-09",
"ShipTime": "12:00:00",
"DeliveryDate": "2013-04-10",
"DeliveryTime": null,
"PurchaseOrderNumber": "0002323803",
"CustomerId": "200540",
"Rate": "801.08",
"EmployeeId1": "1",
"EmployeeId2": "1",
"CarrierId": "201383",
"CarrierRate": "700",
"Tarp": "NO",
"Status": "Dispatched",
"Notes": "Pls check in as an All Points Inc. carrier. V-boards reg. Shipper tracking we need Proof of delivery faxed or called in A.S.A.P (within 24 hours) Need printed name of person signing for load. Must haul 48K min.",
"LoadTypeId": "1",
"LoadType": "Flatbed",
"BillingNotes": "608.48 + 192.60",
"InvoiceDate": null,
"PayDate": null,
"DestinationNext": null,
"Covered": "0",
"CompanyName": "GAF Materials Corp.",
"CarrierName": "Daniel Zamora",
"FN1": "Craig",
"FN2": "Craig"
}
}]
this is the input box
<label for="LoadNumber">Load Number :
<input type="text" size="12" id="LoadNumber" Name="LoadNumber" tabindex="-1" />
</label>

The JSON defines an array which has one entry, which is an object, which has one property, value, which is an object with a bunch of properties, of which LoadNumber is one. Separately, since LoadNumber is an input element, you'd use .value rather than .innerHTML.
So instead of
document.getElementById("LoadNumber").innerHTML = data.LoadNumber
It should be:
document.getElementById("LoadNumber").value = data[0].value.LoadNumber;
(The semicolon isn't absolutely necessary, but I strongly recommend not relying on the Horror of Semicolon Insertion.)
data refers to the array as a whole, so [0] gives us the first entry, then .value gives us the value property of that object, and .LoadNumber gives us the LoadNumber property of that object. More verbosely:
var firstEntry = data[0];
var valueObject = firstEntry.value;
document.getElementById("LoadNumber").value = valueObject.LoadNumber;
Of course, since you're using jQuery, you could use val instead:
$("#LoadNumber").val(data[0].value.LoadNumber);