-1

I'm trying to learn how to create a blog and have stumbled upon the problem of being able to add new content to an existing web page.

The idea is to create two web pages.

Page one; Home page (empty)

Page two; Web form that when submitting, will dynamically add the content of the filled out form onto page one (home page).

So far, with JavaScript i've learned how to create a new element on the click of a button which will add a div onto the current page but I want to find a way to add content to another page (somehow).

Code used to add element on button click 

var number = 1; 
document.getElementById("add_more").addEventListener("click", function() { 
    var newDiv = document.createElement('div'); 
    newDiv.id = 'ep_holder'; 
    newDiv.innerHTML = 'hello world'; 
    document.getElementById('contain_form_upload').appendChild(newDiv); 
});

I've tried numerous times to search for content on the web to help me but everything i stumble across seams to be Wordpress related which has left me no option but to ask the question on here!

I would appreciate if somebody could take the time to help me!

Thanks in advance, Sam.

Improve this question
7
  • Well basically what you have to do, is store the data you entered on page 2, and on the load of page 1, retrieve the information out of the database and make an output and show it?! Commented Sep 30, 2015 at 12:13
  • No point making a new element for your content, create your HTML elements then inject the data in to said elements using AJAX requests, it'd be much easier to maintain in the future. Think about making elements for every time you want dynamic content e.g. making tables using JavaScript. :O Commented Sep 30, 2015 at 12:14
  • php and mysql tags relevance is? Your question doesn't support the tags. Commented Sep 30, 2015 at 12:14
  • Are you implying that you will have two web pages open at the same time and when you submit the form on page 2 the entered values will then appear on page 1 or do you mean that the user goes to page 2, submits the form and then when they return to page 1 the entered values are then visible? Commented Sep 30, 2015 at 12:16
  • RamRaider; My idea is to create a mini blog. So i'm going to create a form which will include a title input and content input. I then want to submit the form and use a way to create a div element on page 1 which will include the title and content information (on page one). Commented Sep 30, 2015 at 12:18

2 Answers 2

Reset to default
0

to show previously submitted data from second page on home page you should:
1) Submit your data using usual HTML form or via javascript.
2) Process request using backend language (for instance PHP).
3) Save it to database (MySQL).
4) On home page, connect to DB when rendering the page and select previously inserted entry. I think you can find further info about each action on stackoverflow.

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

After adding the content to a database each time i fill the form out, what kind of code do i use on my home page to auto load the content from mySQL each time the form is submitted and data is added to the DB?
If you have already inserted data in your DB and you have installed PHP server, you can get data by establishing db connection: $connection = mysqli_connect($hostname,$username,$password,$dbname); Then get data using proper MySQL request $result = mysqli_query($connection, $select_query); Then you can iterate on result and get your data. Please follow step by step manual if you are don't know what's going on.
Is it possible you could send me a link to a step by step on iterating each request and displaying. I understand how to display data from DB but im unsure how to create script to automatically create content every time i submit the form.
I don't know if it really suits you, but here is the example of simple blog (add entries to database and show it) cuttingedgetech.wordpress.com/2009/09/07/basic-blog-1 . It consists of 3 parts.
Ah thanks for your help and time!
0

A web application consists of 2 main parts: The client side and the server side. On the client side, you can do things with javascript, html and css, like what you did there. The server side is where you store the data that you want all the users to see, and the server side is the one that serves the scripts and the pages to the client side. For posts to persist between page loads, you would need to store them somewhere. If it's a miniblog that you want, then something like localStorage wouldn't work since you'd want to show those posts to everyone who visits the blog, hence you're going to need something like php/wordpress/java/node.js/asp.net or whatever technology for the serverside to serve those posts to anyone who visits your home page. The process would be: complete the form, make a POST request to the server, write the server logic (or use an api, depending on what you choose to use) to save the data into some kind of storage (a database would be ideal) and then on the main page just load it from the there.

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.