What's new
By:

🔒 Closed Javascript code textbox validation

Status
Not open for further replies.
A

Arabanot

Forum Guru
hello mga ka phc pa help nito sa code ko.ang problema kasi nito pag space input ko proceed to need step siya ang labas dapat sana value is empty.ano mali dito sa code mga ka phc?ito po code ko .


<!DOCTYPE html>
<html>

<body>

<h1>Textbox Validation</h1>


<input type="text" id="txt1">
<button onclick="val_txt();">Validate Text box</button>

<script>
function val_txt()
{
var txtval = document.getElementById('txt1').value;
if (txtval == "")
{
alert("Value is empty");
return false;
}
else
{
alert("Proceed to next step");
}
}
</script>

</body>

</html>
 
Try mo nga ito paps. Hindi ako sure kung tama...

Code: 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Validate User's Input</title>
  <style>
    .container {
      width: 80%;
      margin: 0 auto;
      border: 1px solid #000000;
    }
    h1, #result {
      font-family: Arial, Helvetica, sans-serif;
      text-align: center;
    }
    #result {
      color: #ff0000;
      font-size: 1.1em;
      font-family: Arial, Helvetica, sans-serif;
    }
    .form {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 15px;
    }
  </style>
</head>
<body>

  <div class="container">
      <h1>Textbox Validation</h1>
  <div class="form">
    <input type="text" id="userInput" placeholder="Enter a value" required />
    <button id="validate">Validate Text box</button>
  </div>
  <p id="result"></p>
  </div>

  <script>
       
      validate.addEventListener('click', (e) => {
       
        'use strict'
       
        e.preventDefault()
       
        const spaces = /^\s*$/;
        const userInput = document.getElementById("userInput").value;
        const result = document.getElementById("result");

        if (userInput == "" || spaces.test(userInput)) {
          result.innerHTML = "Field must not be empty and space is not allowed!"
        } else {
          result.innerHTML = "Proceed to next step";
        }

      })


  </script>

</body>
</html>
 

Attachments

  • 2.jpg
    2.jpg
    51.2 KB · Views: 10
noname18 said:
Try mo nga ito paps. Hindi ako sure kung tama...

Code: 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Validate User's Input</title>
  <style>
    .container {
      width: 80%;
      margin: 0 auto;
      border: 1px solid #000000;
    }
    h1, #result {
      font-family: Arial, Helvetica, sans-serif;
      text-align: center;
    }
    #result {
      color: #ff0000;
      font-size: 1.1em;
      font-family: Arial, Helvetica, sans-serif;
    }
    .form {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 15px;
    }
  </style>
</head>
<body>

  <div class="container">
      <h1>Textbox Validation</h1>
  <div class="form">
    <input type="text" id="userInput" placeholder="Enter a value" required />
    <button id="validate">Validate Text box</button>
  </div>
  <p id="result"></p>
  </div>

  <script>
      
      validate.addEventListener('click', (e) => {
      
        'use strict'
      
        e.preventDefault()
      
        const spaces = /^\s*$/;
        const userInput = document.getElementById("userInput").value;
        const result = document.getElementById("result");

        if (userInput == "" || spaces.test(userInput)) {
          result.innerHTML = "Field must not be empty and space is not allowed!"
        } else {
          result.innerHTML = "Proceed to next step";
        }

      })


  </script>

</body>
</html>
Click to expand...
thanks ts
 
Status
Not open for further replies.

About this Thread

  • 7
    Replies
  • 689
    Views
  • 6
    Participants
Last reply from:
Arabanot

New Topics

Trending Topics

Online now

Members online
1,164
Guests online
1,005
Total visitors
2,169

Forum statistics

Threads
2,274,980
Posts
28,959,750
Members
1,233,502
Latest member
rtprustum
Back
Top