Question

0

72

Vistas

Adding a div to a page via a button in a different page

I am using HTML, CSS, and JavaScript to create a blog. There are 2 pages involved; a page where the posts are displayed, and a page where the posts are made. There is a "post" button in the latter (the page where the posts are made). I want that when the user clicks "post" after writing his or her post a div is added to the former (page where posts are displayed) with the content of the post (innerHTML of the textarea where the post is written).

I have used the following JavaScript code after watching a couple of videos but it is not working.

const BtnAdd = document.getElementById("postButton");
var cWrapper = document.getElementById("contentwrapper");

BtnAdd.addEventListener("click",AddNew);
function AddNew(){
    const newDiv = document.createElement("div");
    newDiv.classList.add("div-shadow");
    newDiv.innerHTML = document.getElementById("postcontent").innerHTML;
    cWrapper.appendChild(newDiv);
}

"cWrapper" refers to the location (div) where I want the divs to be added (in the page where the posts are displayed).

whenever I click the button with ID "postButton" no divs are added to the other page. Any ideas where I went wrong?

7 months ago · Juan Pablo Isaza

1 Respuestas

Responde la pregunta

0

Responde la pregunta

Encuentra empleos remotos

Answer 1 · 2022-07-05T13:56:26.390Z

     //you need to add below code in page 1.
            const BtnAdd = document.getElementById("postButton");
            BtnAdd.addEventListener("click", AddNew);
            function AddNew() {
                var newhtml = document.getElementById("bannerText").innerHTML;
                sessionStorage.setItem("page1content", newhtml);
            }
    
    //you need to add below code in page 2.
            const newDiv = document.createElement("div");
            newDiv.classList.add("div-shadow");
            newDiv.innerHTML = sessionStorage.getItem("page1content");
            var cWrapper = document.getElementById("contentwrapper");
            cWrapper.appendChild(newDiv);


you have to add code two differnt page (page-1 like blog page, and page-2 like blog details page)