Jump to content

howto give html 5 form and id


stormtracker

Recommended Posts

Hello how can I give this form and id, when you submit the form button the contacts will show up in <div id="show"></div> and thankyou

    <section id="weather">
        <div class="container">
            <h1>Search The Weather</h1>
            <form">
                <input type="text" id="city" placeholder="Search City..."><!--Give id -->
                <button type="submit" id="#submitWeather" class="button_1">Submit Request</button><!--Give id -->
                <span id="#warning"></span>
        </div>
      </form>
	</section>

 

Link to comment
Share on other sites

  • 3 weeks later...

Hello, @stormtracker

Please try this code :

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">

</head>
<body>
<section id="weather">
        <div class="container">
            <h1>Search The Weather</h1>
            <form action="#">
                <input type="text" id="city" placeholder="Search City..."><!--Give id -->
                <button type="button" id="#submitWeather" onclick="Show()" class="button_1">Submit Request</button><!--Give id -->
                <span id="#warning"></span>
        
      </form>
      </div>
      <br><br><br>
      <div id="Show">
      
      </div>
	</section>
	
	
	<script>
    document.getElementById("Show").style.visibility="hidden";
    function Show()
    {
    	if(document.getElementById('city').value == '')
        {
            alert("Please Enter Text In Text Box");
        	document.getElementById("Show").style.visibility="hidden";
        }
        else
        {
        	document.getElementById("Show").style.visibility="visible";
        	document.getElementById("Show").innerHTML = "Hello ! <font size='+2'>" + document.getElementById('city').value + "</font>";
        }
    }
    </script>
</body>
</html>

I hope above code will be useful for you.
Thank you.
 

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
×
×
  • Create New...