Button to get me to an <div id= doesn't work - html

I just want that when I press Submit button to get me to the <div id="Home> where the other code will be.
This is my work:
<!DOCTYPE html>
<head>
<title>MyWebsite</title>
</head>
<body>
<div id="Start" align="center">
<h1 style="color:red">My</style><span style="color:blue">Website</span></h1>
<hr/>
Name:<br/>
<input type="text" name="username"><br/>
Password:<br/>
<input type="password" name="password"><br/><br/>
<form action="Home">
<input type="submit" name="continue" value="Continue">
</form>
</div>
<div id="Home" align="center">
<p>Hello world!</p>
</div>
</body>

You need some PHP (or other server side language) between your form and the div below it. Otherwise you're just refreshing the page when you hit submit.
You could also use javascript/jQuery.
Try doing one or both of the above and then come back for help if you have trouble.

Related

How can i get a Text in a Chat Bubble?

I want my entered text to appear in the Bubble. How do I have to change my code to make it work?
My HTML Code is this One:
<!DOCTYPE html>
<link rel="stylesheet" href="style.css">
<div class="Webview">
<div class="message_container" id="myForm">
<div class="Chat_Bubble"></div>
</div>
<form class="send_container">
<input id="textField" type="text">
<p>
<input type="button" id="theButton" value="Nachricht absenden!" onclick="document.getElementById('myForm').innerHTML=document.getElementById('Chat_Bubble').value.innerHTML=document.getElementById('textField').value" />
</p>
<h3>
<div id="div"></div>
</h3>
</form>
</div>
You don't need to both set myForm.innerHTML and Chat_Bubble.innerHTML. You can use:
document.getElementById('myForm').children[0].innerHTML = (...), or
document.getElementsByClassName('Chat_Bubble').innerHTML = (...). You need to get the element using the class name, because the div has a class, not an id.
Also, it's good practice to use textContent instead of innerHTML. This way you're sure that the element submitted is seen as text by the browser. Using innerHTML anyway can break your page. I changed this in the code below.
For example, you should try submitting <b> (nothing is drawn on the screen).
The following code works:
<!DOCTYPE html>
<link rel="stylesheet" href="style.css">
<div class="Webview">
<div class="message_container" id="myForm">
<div class="Chat_Bubble"></div>
</div>
<form class="send_container">
<input id="textField" type="text">
<p>
<input type="button" id="theButton" value="Nachricht absenden!" onclick=" document.getElementsByClassName('Chat_Bubble')[0].textContent = document.getElementById('textField').value" />
</p>
<h3>
<div id="div"></div>
</h3>
</form>
</div>

how to make a pass word that will redirect me to another page only when its correct. all while staying on the same tab

I'm a beginner and I'm using HTML to embed aspects onto google sites. forgive me if my title wasn't specific or my question is idiotic.
this is my code:
<div class="wrapper">
<form class="form1" action= "sites.google.com" onsubmit="return (this.pass.value==='1291')?true:false;">
<div class="formtitle">Enter the password to proceed</div>
<div class="input nobottomborder">
<div class="inputtext">Password: </div>
<div class="inputcontent">
<input type="password" name="pass" />
<br/>
</div>
</div>
<div class="buttons">
<input class="orangebutton" type="submit" value="Login" />
</div>
the problem is it will redirect me to the other page on a new tab that it opens is there any way to keep it on the same tab?
another problem is that it will show the password in the URL is there any way to prevent that?
thanks for your help

Problems with the date attribute in HTML5

I have this code that I am building for my internship. I am trying to use the "date"input type in my code to add a pop up calender, however it isn't working. I have look at numerous websites, but i have yet to find someone who is having this problem. Any ideas on how to make this work? Here is my code:
<body>
<h1> Time Logging Form</h1>
<form method="post" id='datetime'>
<div class="form-row" id='datacell'>
<div class="editor-cell">
<input type="date" id="date">
</div>
<div class="editor-cell">
<input placeholder="Time in 00:00" type="text" id="timein">
</div>
<div class="editor-cell">
<input placeholder="Time out 00:00" type="text" id="timeout">
</div>
</div>
<input type="submit" value="+" id='plus'>
<input type="submit" value="submit" id='submit'>
</form>
</body>
What exactly you want to do with data attributs? When you run this html code in your browser, the calendar appears:
https://jsfiddle.net/6w5b5r5h/
<body>
<h1> Time Logging Form</h1>
<form method="post" id='datetime'>
...
</form>
</body>

Going back to the page before by pressing the button in the browser

I have two html pages.
I enter to the first page, press the button and go to the second page.
The problem is that when Im in the second page (signin.html) and I press the back button from the browser I dont go to the first page (welcome.html) I go to some other previous page. I need to be able to go back by pressing that button, how can I achive that?
html 1 welcome.html
<HTML>
<HEAD>
<TITLE>
Welcome page
</TITLE>
</HEAD>
<BODY>
<div>
<div class="button">
<input name="account" type="button" value="I am a service provider" onclick="window.location.replace('/member/sign-in.html')"/>
</div>
</BODY>
</HTML>
html 2 signin.html
<HTML>
<HEAD>
<TITLE>
Member sign in
</TITLE>
</HEAD>
<BODY>
<form id="myform" action="/my-code/signInMember.php" method="post">
<div>
<label for="spEmail">E-mail:</label>
<input type="email" id="spEmail" name="spEmail" required/>
</div>
<div>
<label for="spPswd">Password:</label>
<input type="password" id="spPswd" name="spPswd" required/>
</div>
<div class="button">
<button type="submit" name="submit">Sign in</button>
</div>
<div class="button">
<input name="submit" type="button" value="sign up for free" onclick="window.location.replace('/member/create-account.html')"/>
</div>
<div/>
</form>
</BODY>
</HTML>
Any ideas? I was looking around and everybody say to add a button to go back (with php or javascript) but I dont want that. I want to press the browser button and then go back, no with a button in the page itself.
Thanks, any help will be appreciated.
onclick event rather than using "window.location.replace('/member/sign-in.html')" use "window.location.href='/member/sign-in.html'" or "window.location.href='member/sign-in.html'" according to your path of destination html.
thanks, I changed as suggested:
<form>
<input TYPE="button" VALUE="Offer this service"
onclick="window.location.href='/member/signin.html'">
</form>
And it worked!

HTML form does not submit with file upload

EDIT: This seems to be due to the file itself and possibly where it is stored on the machine (it's on a mounted volume). It is unlikely to be related to the form or Django, since other files work as expected.
I have a pretty simple HTML page with a form which is behaving very strangely:
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta name="generator" content=
"HTML Tidy for Linux (vers 25 March 2009), see www.w3.org">
<title>Add picture</title>
</head>
<body class="app-products model-picture change-form">
<!-- Container -->
<div id="container">
<!-- Header -->
<div id="header">
<div id="branding">
<h1 id="site-name">administration</h1>
</div>
</div><!-- END Header -->
<!-- Content -->
<div id="content" class="colM">
<h1>Add picture</h1>
<div id="content-main">
<form enctype="multipart/form-data" action=
"/admin/products/picture/add/" method="post" id="picture_form"
novalidate="" name="picture_form">
<div>
<fieldset class="module aligned">
<div class="form-row field-alt_text">
<div>
<label class="required" for="id_alt_text">Alt text:</label>
<textarea class="vLargeTextField" cols="40" id="id_alt_text"
name="alt_text" rows="10">
</textarea>
</div>
</div>
<div class="form-row field-original_image">
<div>
<label class="required" for="id_original_image">Original
image:</label> <input id="id_original_image" name=
"original_image" type="file">
</div>
</div>
</fieldset>
<div class="submit-row">
<input type="submit" value="Save" class="default" name="_save">
<input type="submit" value="Save and add another" name=
"_addanother"> <input type="submit" value=
"Save and continue editing" name="_continue">
</div>
</div>
</form>
</div><br class="clear">
</div><!-- END Content -->
<div id="footer"></div>
</div><!-- END Container -->
</body>
</html>
It is being served up by a django application as a static file (to keep things simple).
When I click the "Save" button to submit the form without filling it out at all (or if I put some text in the textarea), I see a POST request go through to the django application as expected. However, if I choose a file with the "file" input and then try to submit the form, no POST request reaches the application. In fact, no request is sent (I'm watching the HTTP traffic in wireshark). In Google chrome, I see the following error page:
Any ideas?
Are the name of your inputs separated by a white space?
name= "myinputname"
If so, the form will not process.