Jump to content

Dynamic <div>


DanH42
 Share

Recommended Posts

I'm trying to make a page that will use a user-submitted input as a variable in a <div>. something like:<input type="text" name="textfield"><input name="subj" type="submit" id="subj" value="Submit"><br><div class="monitter" id="tweets" title=subj lang="en"></div>Where subj is the variable that i want to be changed when the form is submitted.Not sure if this is possible with purely HTML or not.I don't mind if the page has to redirect somewhere else, although a non-redirecting solution would be nice.

Edited by DanH42
Link to comment
Share on other sites

Guest FirefoxRocks

Redirecting requires PHP, and is more accessible than non-redirecting. Well, it could be done with ASP and other S3L, but I don't know any :).Non-redirecting requires JavaScript and doesn't work if users have JavaScript disabled.Redirecting method:Page 1:

<form action="page2.php" method="get"><p><input type="text" name="textfield"> <input type="submit" id="subj" value="Submit"></p></form>

Page 2:

<!DOCTYPE html><html><head><title>Page 2 </title></head><body><?php	if(isset($_GET["textfield"]) && !empty($_GET["textfield"])) {		$x = $_GET["textfield"];	}?> ... some HTML here ...<!-- remove the form if you wish --><form action="page2.php" method="get"><p><input type="text" name="textfield"> <input type="submit" id="<?php echo $x; ?>" value="Submit"></p></form><div class="monitter" id="tweets" title="<?php echo $x; ?>" lang="en"></div>... some more HTML here perhaps? ...</body></html>

Non-redirecting (however I will omit the ID attribute from the submit button because I'm not sure if you need it):

<!DOCTYPE html><html><head><title>Page 2 </title><script type="text/javascript">function changeTitle(text){    document.getElementById("tweets").title = text;}</script></head><body><!--  ... some HTML here ... --><p><input type="text" name="textfield"> <input type="submit" value="Submit" onkeyup="changeTitle(this.value);"></p><div class="monitter" id="tweets" lang="en"></div><!-- ... some more HTML here perhaps? ... --></body></html>

Hope this helps.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...