Put in Required function

Question

Put in Required function

Navigation

#1 by (1 votes)
#2 by (1 votes)
#3 by (1 votes)
#4 by (0 votes)

1

I want the text box to be mandatory in order to fill it out, can you help?

<html>
    <body>
        <p>Please input a number between 1 and 10:</p>

        <input id="numb">

        <button type="button" onclick="myFunction()">Submit </button>

        <p id="demo"></p>

        <script>
            function myFunction() {
                var x, text;

                // Get the value of the input field with id="numb"
                x = document.getElementById("numb").value;

                // If x is Not a Number or less than one or greater than 10
                if (isNaN(x) || x < 1 || x > 10)  {
                    text = "Input not valid";
                } else {
                    text = "Input OK";
                }

                document.getElementById("demo").innerHTML = text;
            }
        </script>
    </body>
</html>

javascript html

asked by anonymous 15.09.2017 / 13:31

4 answers

Drop Inventory with SQL Triggers How to convert Date to integer in java?

score 1 · Answer 1

In your <script> you can try the following code besides the message you return:

<script>
    function myFunction() {
        var x, text;

        // Get the value of the input field with id="numb"
        x = document.getElementById("numb").value;

        // If x is Not a Number or less than one or greater than 10
        if (isNaN(x) || x < 1 || x > 10)  {
            text = "Input not valid";
        } else {
            text = "Input OK";
            document.getElementById("id-do-seu-formulario").submit();
        }

        document.getElementById("demo").innerHTML = text;
    }
</script>

With this, if the Input is OK, it triggers the submit of your form.

score 1 · Answer 2

Hello, how are you? I do not know if I understand your question very well, but come on. Note: I took the liberty of making some changes to the code.

<html>

<head>
	<script>
	function myFunction() {
		var elements = {
			input: document.getElementById('numb'),
			label: document.getElementById('result'),
			
		};
		
		var rgx = new RegExp(/^\d+$/);
		
		if (!!elements.input.value)  {
			elements.label.innerHTML = rgx.test(elements.input.value)? 'Input OK' : 'Input not valid';
			return;
		}
		
		elements.label.innerHTML = 'Input not valid';
	}
	</script>
</head>
<body>
        <p>Please input a number between 1 and 10:</p>

        <input id="numb">

        <button type="button" onclick="myFunction()">Submit </button>

        <p id="result"></p>
    </body>
	
</html>

score 1 · Answer 3

1

Using HTML itself to validate your face form just put REQUIRED in your input field, follow a good link for you to understand and make your life easier, saving time instead of creating scripts link

15.09.2017 / 15:43

score 0 · Answer 4

This is a lot easier, it should help you:

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="css/style.css" rel="stylesheet">
</head>
<body>
    <form action="">
    <p>Please input a number between 1 and 10:</p>

        <input id="numb" type="number" max="10" min="1" required name="teste">

        <button type="submit">Submit </button>

    </form>
</body>

Note that I have set the max and min property to input , this already validates for you the range of numbers you want to be allowed inside the input.