CODEWITHSUNDEEP
javascriptforeachejs
bruno salapic
bruno salapic

Reputation: 75

problems with ejs(data.forEach is not a function)!

Hello so i am trying to run a javascript function inside of a ejs file and this is what my code looks like :

<div class='row'>

<% data.forEach( function( items ) {  %>

    <div class='col-md-4 col-sm-6'>
        <div class="thumbnail">
        <img src="<%= items.img %>" width="350" height="130"></img>    

         <div class="caption">
            <h4><%= items.partname %></h4>
        </div>
        </div>



    </div>

<% }); %>

</div>

when i try and run this inside my ejs file i get this error as a return " 36| 37|

38| <% data.forEach(function(items){ %> 39|
40| 41|

data.forEach is not a function at eval (eval at

does anyone know how to fix this?

this is the backend for my code above:

app.use(bodyParser.urlencoded({extended: true}));
  app.set("view engine","ejs");

var chairSchema=new mongoose.Schema({
    partname:String,
    img:String,
    price:Number
});

var data =mongoose.model("data",chairSchema);

data.create(
{
  partname:"short cylinder",
  img:"http://www.needforseatusa.com/assets/images/products/replacement%20parts/short_cylinder_thumbnail.jpg",
  price:14.90
},
{
  partname:"regular cylinder",
  img:"http://www.needforseatusa.com/assets/images/products/replacement%20parts/cylinder_thumbnail.jpg",
  price:14.90
},{
  partname:"back pillow",
  img:"http://www.needforseatusa.com/assets/images/products/replacement%20parts/lumbar_pillow_thumbnail.jpg",
  price:29.90
},{
  partname:"head pillow",
  img:"http://www.needforseatusa.com/assets/images/products/replacement%20parts/head_pillow_thumbnail.jpg",
  price:29.90
},{
  partname:"wheel base chrome",
  img:"http://www.needforseatusa.com/assets/images/products/accessories/hd-base-black_thumbnail.jpg",
  price:79.99
},{
  partname:"wheel base black",
  img:"http://www.needforseatusa.com/assets/images/products/accessories/hd_base_)1_thumbnail.jpg",
  price:79.99
},function(err,chair){
  if (err){
    console.log(err);
  }
  else{
    console.log("newly created chair");
    console.log(data);
  }

}


);
app.get("/",function(req,res){
    res.render('landing');
});


app.get("/campground",function(req,res){
   data.find({},function(err,data){
      if(err){
        console.log(err);
      }

    });

   res.render("campground", {data:data}); 
});

Upvotes: 3

Views: 16273

Answers (5)

Gashaw Fentaye
Gashaw Fentaye

Reputation: 1

This is because the read operation takes some time, and if it's not awaited, EJS may attempt to render the template before the data is ready, resulting in errors or undefined values. try this way

     async () => {
           const products = await Product.find()
           res.render('home', { user: req.user, products: products });
        }

Upvotes: 0

Irikefe Ikie
Irikefe Ikie

Reputation: 1

My server.js had the following code:

res.render('index', articles: 'articles')

When I removed the strings from the second articles, the error went away. By the way the articles were in curly braces.

Upvotes: 0

otumian Empire
otumian Empire

Reputation: 39

I had the same issue and it was how I sent the data to the view.

So after I had queried the database, as in

db.getTasks()
    .then(results => res.render('view', { results: results }))
    .catch(err => ...)

I returned the result to the view and not the rows, results.rows to the view. Just by adding ..rows to the result solve my problem

db.getTasks()
    .then(results => res.render('view', { results: results.rows }))
    ...

Upvotes: 0

Ebrahim Behroo
Ebrahim Behroo

Reputation: 3

if you use node js for get data from database, use async and awit , because you send data to ejs file without any value in it

Upvotes: 0

Akinjide
Akinjide

Reputation: 2763

Here's a sample example of using foreach with ejs, I want you to inspect that data you are sending back to ejs, if it's an Array. Otherwise make sure it is, because foreach is an Array method.

var data = {    
  title: 'Cleaning Supplies',
  supplies: ['mop', 'broom', 'duster']  
};

ejs

<ul>
<% data.supplies.forEach(function(value) { %>
   <li><%= value %></li>
<% }) %>
</ul>

// mop
// broom
// duster

Upvotes: 7

Related Questions