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

Question

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}); 
});

Solution

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

Comments

[alexr101]

You have to verify your backend request. This front end code is good. That data variable is either not being passed or has problems with it. What do you get if you console.log(data) on the ejs page? Also post the backend request that'll be more useful

[bruno salapic]

i have added the backend request

[Akinjide]

Is data an Array or Object?

[shizhen]

please make your answer more specifically.