Disable an object from showing up in your DOM

First of all, sorry for the description, but I couldn’t think of a better way to explain this complicated problem I’m having. It’s gonna be a long read tho.

Imagine you have a web page that gives you to-do’s. These to-do’s are coming from a server (so you can not edit the to-do’s you’re receiving). Every 90 seconds, you’ll get the JSON file from the server that contains the to-do’s. When you finish a to-do, you mark it as “complete” and it disappears from the DOM (this is not a problem, since I can do this easly).
Let’s say that the server is sending you a json file that looks like this:

[
{
   "to-do-one": "wash the dishes",
   "to-do-two": "take out the garbage",
   "to-do-three": "clean the house"
},
{
....more to-do's (you get the point)
}
]

So let’s say you completed the “to-do-one” : “wash the dishes”, and you’ve marked it as completed in the webpage, and it disappears from the DOM (expected behavior). Disabling it from showing wouldn’t really be a problem if I only received “to-do-one” : “wash the dishes” only once. The problem is, if I mark it as completed,
after 90 seconds when I again receive the JSON file from the server, my script would say, “oh okay I see that the JSON contains “to-do-one” : “wash the dishes”, that was marked as completed so I will not bother to display it.”,
and I say again, that would work perfectly if I only received that task once. But let’s say that you washed the dishes, marked it as a completed task, and after an hour, another load of dirty dishes plied up. But since the task is marked as completed, my script won’t know why it should display it again. Can anyone think of any solution that could be implemented?

TLDR:
-You receive a json file with to-do’s every 90 secs
-You mark the task as completed
-You receive the file again, script skips the task since it is marked as completed
-A task with the same name appears again and doesn’t get displayed cause you said it’s complete
-???

Hi @silic5494,

Well I think it would be pretty simple to have an array of completed tasks, and then when you’re looping through the newly received JSON you can check against that array to see if it is completed and skip it if so. You could probably use completedTasks.indexOf(jsonObject); where completedTasks is an array, and jsonObject will represent a task in the todo list you’ve just received from the server.

Hope this helps…

Timestamp each todo item. When an item is marked as being done, you send the timestamp for that item back to the server. That way the server can know which one is being marked.

That way, the computer can do its work entirely with the timestamps, with the text display being for the benefit of people viewing it.

Well that would be good if all the tasks were unique. But since they are not, it wouldn’t be of much help. Thanks for the recommendation!

Sending a response back to server would be alright, but I can not edit the files I’m receiving. Even if I could, I would get totally new JSON after 90 seconds, so any previous changes that were made, would just disappear. Thanks for the recommendation!

From the look of your example property names, I’m guessing you have not shown enough to allow coming up with a solution. If you can not control the property names / values and the structure does indeed not have any way to differentiate between an old “to-do-one” vs. a new “to-do-one” I don’t see how it can be done on the receiving side.

Are there no other properties such as eg. “id”, “time”, etc.?

Any reason you can’t post a bit of an actual example?

There are unfortunately no id’s. Time exists, but it doesn’t say when a persay to-do was received eg.(02.16.2019). It gives you the time since it was received (0h,5m,12s). Can’t post actual data, since the data I’m handling is confidential. This is the best example that I could think of :smiley:

Actually while reading your comment again, something that could work popped up into my mind.
I could run a function that would check if any of the tasks have been completed, if they were, check the time since it was received and if that time is less than a minute or two, remove the completed mark from it, parse it and show it in the dom. Thanks dude!

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.