CODEWITHSUNDEEP
javascripthtmlasp.net-mvc
Jacek
Jacek

Reputation: 12053

IsNullOrEmpty attribute

In HTML exists

required

attribute, which force user to enter some date before submit. But user can type only spaces. Is there attribute which check is typed content is whitespace before postback. In need attibute which works similar to string.IsNullOrWhitespace in c#.

Upvotes: 0

Views: 218

Answers (3)

Paul S.
Paul S.

Reputation: 66324

Using the pattern attribute, you can make it accept only spaces

<form action="?" method="post"> <!-- required for snippet -->
  <input type="text" required pattern="\s*"/>
</form>

However, please note that required prevents the submission of empty input (i.e. your "null"), so to permit that remove required so that pattern is doing the requirement checking

<form action="?" method="post"> <!-- required for snippet -->
  <input type="text" pattern="\s*"/>
</form>

Lastly, still perform validation on the server as you can never assume a client is a safe source, or conversely, always assume the client is trying to hack you

If you can't assume HTML 5 support, you can shim the behaviour using JavaScript, which would look something like this for required

if(!('required' in document.createElement('input'))) {
    window.addEventListener('submit', function (e) {
        var form = e.target, 
            inputs = form.getElementsByTagName('input'),
            i;
        for (i = 0; i < inputs.length; ++i)
            if (inputs[i].getAttribute('required'))
                if (!inputs[i].value)
                    e.preventDefault(); // + warn?
    });
}

and for pattern

if(!('pattern' in document.createElement('input'))) {
    window.addEventListener('submit', function (e) {
        var form = e.target, 
            inputs = form.getElementsByTagName('input'),
            i,
            re;
        for (i = 0; i < inputs.length; ++i)
            if (re = inputs[i].getAttribute('pattern')) {
                re = new RegExp('^' + re + '$');
                if (!re.test(inputs[i].value))
                    e.preventDefault(); // + warn?
            }
    });
}

You could also set useCapture to true for the listener to skip ahead in the queue of handlers, letting you prevent the event reaching other handlers in the case of submission prevented

Upvotes: 1

somethinghere
somethinghere

Reputation: 17340

It took me a while to get the Regex right, but the following creates a rule to only select if there's no whitespace:

<input type="text" pattern=".\S*" />

As @Paul S. noted, this isn't checking the first character, so the following will do that:

<input type="text" pattern="^.\S*" />

Also, this does indeed only work in HTML5 browsers, but since the question contained required, I'm assuming there if is some fallback kept in mind.

Upvotes: 1

Pushker Yadav
Pushker Yadav

Reputation: 856

<
<form onsubmit="alert('Submitted.');return false;">		          <input type="text" required="" pattern="(?:19|20)[0-9]{2}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))" value="" name="dates_pattern2" id="dates_pattern2" list="dates_pattern2_datalist" placeholder="Try it out." autocomplete="off">		          <input type="submit" value="»">		          <datalist id="dates_pattern2_datalist">		          </datalist>		        </form>

Upvotes: 0

Related Questions