How to use alert to display an array in a popup box javascript?

Question

I am pretty new to Javascript

I have been assigned to make a database using objects and organizing them into an array. I need to make sure the user can see all the objects in the array, allow the user to add and remove any objects, and allow the user to search for any objects. So far I have this but I am stumped on how to display the array in a popup box using purely javascript in jsfiddle.

var books = [

 book1 = {
    bookName: "Keeper of the Lost Cities",
    author: "Shannon Messenger",
    goodreadsRating: "4.5/5"
  },

 book2 = {
    bookName: "Eragon",
    author: "Christopher Paolini",
    goodreadsRating: "3.9/5"
   },

  book3 = {
    bookName: "The House of the Scorpion",
    author: "Nancy Farmer",
    goodreadsRating: "4.1/5"
   }
];

let array = books;

Do you have a requirement that says you have to use `alert()`? You can almost as easily create a dynamic `
` that's populated with the data from your array. — , Jan 10 '18 at 03:21
The question is still too broad... Did you try anything to achieve desired result? — dhilt, Jan 10 '18 at 03:21
@Blurp...no I do not need to use alert() I just need to convey the user what is in the array using a pop up box — Arty Messenger, Jan 10 '18 at 03:24
@dhilt I tried alert(books.join('\n')) but it didn't work I'm not sure if I used it correctly though — Arty Messenger, Jan 10 '18 at 03:24
Some nice person might come along and give you a solution, but it sounds like you might be better off going through some tutorials on https://developer.mozilla.org/ or https://www.khanacademy.org/ or some other site. — , Jan 10 '18 at 03:24
If you _really_ want to use alert, check out this question/answer: https://stackoverflow.com/a/4293047/8651755 — , Jan 10 '18 at 03:27
I think you can create a modal (using boostrap or materialize) then populate the data in a div. I dont think alert() is the solution here — vicnoob, Jan 10 '18 at 03:28

score 0 · Answer 1 · answered Jan 10 '18 at 03:32

You can use any jquery plugin for display popup box.

<script src="../popupJquery.js"></script>  
<div id="contentId" style="display:none">
<script>
   $(function(){
    $('#contentId').popModal({
     html : /*convert your javascript array in html like in table**/
     });
   });
</script>

score 0 · Answer 2 · edited Jan 11 '18 at 10:19

Use the code below for reference.

See the result

    var books = [

     book1 = {
        bookName: "Keeper of the Lost Cities",
        author: "Shannon Messenger",
        goodreadsRating: "4.5/5"
      },

     book2 = {
        bookName: "Eragon",
        author: "Christopher Paolini",
        goodreadsRating: "3.9/5"
       },

      book3 = {
        bookName: "The House of the Scorpion",
        author: "Nancy Farmer",
        goodreadsRating: "4.1/5"
       }
    ];
    
    var str = "";
    
    books.forEach(function(d){
     str += JSON.stringify(d); 
    });

    alert(str);

How to use alert to display an array in a popup box javascript?

2 Answers2