Ways to Display This Input for each Index

My HTML input consists of the following data:

{
administrator: true,
premium: true,
name: 'John',
city: 'Bucharest'
},{
administrator: false,
premium: true,
name: 'Marry',
city: 'London'
},{
administrator: false,
premium: false,
name: 'Arya',
city: 'Bucharest'
}

I want to output every element with city === 'Bucharest' like this:

All people from Bucharest are:

John
Arya

I have attempted the following code:

var users = document.getElementById("oneUser").innerText;

users.forEach(function (user){
                    console.log(user);
                })

However, it resulted in an error:

Uncaught TypeError: users.forEach is not a function

I also tried to use JSON.parse(), but the input structure does not match a valid JSON type due to missing double quotes in the first parameter.

EDIT:

<p id="oneUser" style="display:none"><%= users %></p>

The <%= users %> array originates from a mongodb database.

Initially, I assigned it to a JavaScript variable which is why it is now stored as a String.

var users = document.getElementById("oneUser").innerText;

Answer №1

Give this a shot -

[
   {
      "admin":true,
      "premium":true,
      "name":"Alexis",
      "city":"Paris"
   },
   {
      "admin":false,
      "premium":true,
      "name":"Ryan",
      "city":"New York"
   },
   {
      "admin":false,
      "premium":false,
      "name":"Sara",
      "city":"Tokyo"
   }
]

 filterData = (property, value) => {
      return dataset.filter(element => element[property] == value)
 }

Example of usage -

filterData("city", "Paris")
filterData("premium", false)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the possibilities of jQuery with Accordion functionality and creating dynamic multiple menus

Incorporating the Wayfinder and Accordion menus, I have set up a two-level menu structure for the left column. The structure looks like this: <ul class="accordion">: Menu 1 Sub-menu 1.1 Sub-menu 1.2 Sub-menu 1.3 Menu 2 Sub-menu 2 ...

User interface not refreshed following $http.get request

Greetings, I am currently working with an angular.js controller that looks like this. function WorkSpacesController($scope, $http, notifications) { $scope.Workspaces = []; $scope.Query = ""; $http.get("api/Workspaces/GetAllWorkspaces/").then(functio ...

Issue [ERR_REQUIRE_ESM]: Importing an ES Module using require() is not compatible with node_moduleswrap-ansiindex.js

Encountering an issue in my nestjs project with a library that is indirectly used by a third-party. stringWidth = require('string-width') in node_modules\wrap-ansi\index.js:2 not supported Here are the dependencies listed in package. ...

When the "x" close icon is clicked, the arrow should toggle back to 0 degrees

I've been tackling the challenge of creating an accordion and I'm almost there. However, I'm facing an issue where the arrow doesn't return to its original position after clicking the close "x" icon. The toggle works fine but the arrow ...

Exploring the interactive features of discord.js version 12

Currently, I have a bot set up to log when invites are created, but the logs are only going to a specific channel ID that I designated. I would like to make it so that this can be changed on a per-server basis. Intended Output User: !log channel (CHANNEL ...

Managing empty values within a two-dimensional array

Exploring an out of bounds check issue, I'm struggling with managing undefined values within a 2d array. My attempted solutions include verifying if both the column and row index are present using if(!arr[x][y]), checking if both are undefined with i ...

Angular 12 app does not have Express server searching for static files

Context I am in the process of transferring an Angular application to a GKE cluster. Unfortunately, due to company policy, the base docker image I am required to use does not support the installation of new software such as shell or Angular CLI commands l ...

Error message: WebTorrent encountered an issue and was unable to pipe to multiple destinations at once

Upon attempting to stream video from a provided torrent file, I encountered some unexpected issues. The example was taken from the official site, so one would naturally assume it should work seamlessly. To troubleshoot, I tried setting up a default site u ...

Cannot call `post` on WEBPACK_IMPORTED_MODULE_0__ -> Use Axios to create a request and then post

I am in the process of developing a versatile API service using axios. api.js import axios from 'axios' export default () => { return axios.create({ baseURL: `${window.location.origin}/` }) } authenticationService.js imp ...

Is there a way to extract JSON data from the page source? I've experimented with multiple techniques, but none seem to be successful

I have the following code: from bs4 import BeautifulSoup as bs4 from urllib.request import urlopen user = "khaby.lame" u = urlopen("https://tiktok.com/@" + user).read() soup = bs4(u, "html.parser") print(soup) The code above ...

The ng-model in Angular is unable to capture the initial input value on load

I am currently using a window onload script to obtain longitude and latitude data and pass them to hidden input values. $(function() { window.onload = getLocation; var geo = navigator.geolocation; function getLocation() { if (geo) { geo ...

Having trouble sending the request body via next-http-proxy-middleware

Recently, I've been attempting to develop a frontend using nextjs that communicates with a Java backend. To achieve this, I'm utilizing the npm package next-http-proxy-middleware. However, it seems like either my request body is getting lost in t ...

What is the best way to ensure that my grid remains contained within its designated area?

I need to incorporate a grid of 16x16 or 64x64 into my layout without it overflowing. I'm considering using flexbox, but unsure of the implementation process. My goal is to have the grid resize based on the container size rather than exceeding its bou ...

Assistance needed with looping through a JSON data structure

Hello, I am facing an issue after a query in PHP and converting the results to JSON using json_encode. The JSON data I have is: {"ga:visits":"59","ga:pageviews":"117","ga:timeOnSite":"4775.0","average_time_on_site_formatted":"0:01:20","pages_per_visit":"1 ...

How do I select the first element with class "cell" in D3, similar to jQuery's $(".cell:first")?

I have attempted this: d3.select(".cell:first") d3.selectAll(".cell").filter(":first") d3.selectAll(".cell").select(":first") but unfortunately, none of these methods are effective. ...

The Django Selenium test is encountering a failure due to its inability to locate an element that is added after a click event

I'm currently facing an issue when writing a test for my application as it continues to fail. Despite attempting to use both WebDriverWait and time.sleep(), the problem persists. The troublesome section of the test appears as follows: form_2.find_el ...

Make sure to invoke the navigate() function within a React.useEffect() hook, rather than calling it during the initial rendering of

I am new to ReactJS. When the page initially loads, I need to check if the state is null, and if it is, redirect to a different login Page Below is the code for the component: export default function Addblousesalwar() { const navigate = useNavigate(); ...

Transforming an Angular 11 HTML template into Angular code

After attempting to transfer the Porto Admin HTML template to Angular, I encountered some issues. When including the CSS and JS dependencies in the project, everything worked fine with all the HTML code in index.html. However, when I moved the code to app. ...

Guide on utilizing Chrome Push Notifications on an HTTP website

I'm looking to incorporate Chrome push notifications (GCM) on my HTTP site. I've read that it's typically only for HTTPS sites, but is there a workaround or sample code available for integrating push notifications on an HTTP site? I'm ...

Removing a specific attribute from a JSON string in C#

I have a JSON string that looks like this: [{ "attachments": [{ "comment": "communication", "comment_date_time": "2035826"} ], "spent_hours": "4.00", "description": "" }, { "attachments": [], "spen ...