Dojo ValidationTextBox , invalidMessage is never shown - dojo

When and in what case , the invalidMessage is shown ??
Here in my case , the invalidMessage is never shown .
<input
type="text"
id="firstName"
size="20"
dojoType="dijit.form.ValidationTextBox"
required="true"
propercase="true"
promptMessage="Enter first name."
invalidMessage="First name is required."
trim="true"
/>

Invalid message appears when the content of the text box is invalid according to a given regular expression (passed using the regExp parameter). In your case you do not pass a regExp parameter, so the content is always valid.
What you want is the "promptMessage" parameter, which appears when the text box is empty and on focus (null by default). Think of this like a tooltip that tells the user what to do, not an error message that tells the user what they've done wrong. Message disappears when user starts typing.
All of this is explained in the reference and in the API, both of which I have in my browser when programming with Dojo.

Related

Why do I get this warning: '#Model.property' is not a valid value of attribute 'checked'?

I have several checkboxes that I use for display purposes of 'true' and 'false'. Each one will show me the above warning (I made the warning more generic for the purposes of searching. In reality, it reads #Model.Service_Request_Information.Servicelead, etc, instead of #Model.property)
<input class="custom-control-input" type="checkbox" checked="#item.Servicelead" disabled />
I have read that it is okay to write razor code like this, and the HTML will insert/leave out 'checked' from the attributes depending on the value. It works fantastically for how I want it, and it doesn't prevent my code from compiling. So, any ideas on why I am getting this warning?
Razor will render a boolean attribute if the expression you pass to it evaluates to true. If the expression evaluates to false, the attribute is not rendered at all. That is the Razor feature you are using in your example.
In HTML, valid values for the checked attribute are an empty string or "checked" (Specs) i.e. checked or checked="checked". Visual Studio reports HTML errors as warnings by default, which is what you are seeing. You can either ignore it, turn HTML validation off:
Tools > Options > Text Editor > Html > Validation
Or you can use a ternary expression as demonstrated by other answers:
#(item.Servicelead? "checked" : "")
The checked attribute does not have a value. It should only be set when #item.Servicelead is true.
Use this code instead:
<input class="custom-control-input" type="checkbox" #(item.Servicelead? "checked" : "") disabled />

How to validate input text length in material input?

I am developing an application using angular dart. I am using angular dart material input for getting input from user.
I have a multiline text input for which I use material input and type="text".
I have made this field "required" but the problem is when the user enters white space or enter, the "required" is gone. I need a attribute where i can specify a constraint that at least one non-white space character must be entered.
How to achieve this?
Here is my code where I have used material input:
<material-input
ngControl="textAnswer" [(ngModel)]="answer" multiline
type="text" label="Your answer" required>
</material-input>
As per documentation you can use all input elements attribute with it.
All of the attributes that can be used with normal <input> and <textarea> elements can be used on elements inside <mat-form-field> as well
So use HTML5 pattern attribute to match the custom pattern(regular expression).
<material-input
ngControl="textAnswer" [(ngModel)]="answer" multiline
pattern="[\s\S]*\S[\s\S]*"
type="text" label="Your answer" required>
</material-input>
[\s\S]*\S[\s\S]* will help to match a string with at least one non-space character.
NOTE : To include all other character use [\S\s] since . doesn't include a newline character.

Geb: How to add new attribute and its value

I have an input element where I need to set one extra attribute and its value.
<input autocomplete="off" id="to_input" name="to" class="form-control arrival ui-autocomplete-input" placeholder="To" data-input-component="searchCondition" data-input-support="suggest" type="text">
I need to add the below attribute:
How can I do this in Geb?
To say a little more details, when I enter TPE in the input text box, some dropdown items appears and when I select one of them like
"Taipei, XXX.. (TPE)"
Than the new attributes are set automatically same as the picture above.
The only way to do it, is using JavaScript executor:
browser.driver.executeScript("your script")
And script using jquery will look like:
$('jquery-selector').attr('attribute-name', 'attribute-value');
Of course make sure to fill in your data in quotes!

placeholder input field not showing value?

I have an input box with placeholder.and I am setting the value in this field via Session variable in php.
This is the code which I have written :
<input type="text" value=<?=$_SESSION['no_of_persons']?> name="no_of_persons" id="no_of_persons" placeholder="No. of Person(s)" maxlength="3" />
and when I run this in firefox and watching the code in Firebug this following code is coming :
<input id="no_of_persons" type="text" maxlength="3" placeholder="No. of Person(s)" name="no_of_persons" value="7">
Problem is I am not able to see the value in textfield in the web page.
I go to firebug and edit html in firebug. What I do is when I press an space key at the end of input tag i.e after value="7" then the value 7 becomes visible on web page.
I am not getting why the browser automatically changing the sequence of attributes of input tag and also I already had closed input tag then why the browser not closing it.
I tried it in other browser also like safari,chrome but not working.
Please help me to get rid off this problem.
Thanks in advance!!! :)

Refining my Dojo/Dijit NumberTextBox numeric validation

I have the following code:
<input type="text" dojoType="dijit.form.NumberTextBox" size=8
constraints="{min:0,max:100000,places:0}"
id="orgNumberOfStudents" name="orgNumberOfStudents"
required="true" invalidMessage="Integer between 0 and 100,000"
value="">
Questions:
1) How do I set the width of the box? Do I have to do it in a style tag or a CSS? Is the traditional "input size" tag ignored?
2) The above sample shows the error when I type in a non-numeric value. But if I tab over the field and don't fill in anything, it's still blank. Is there a quick way to enforce the validation when I click the submit button? Do I need a Dijit submitt button? Do I need to write more JavaScript to make this happen? How does the required="true" actually occur?
(One get-around is to set the value to 0, but I'd rather force the user enter a value rather than just defaulting it).
Thanks,
Neal Walters
You should be able to use both CSS and traditional INPUT attributes like "maxLength" on your NumberTextBox by passing them in to the Widget's constructor. maxLength is available on all dijit.form.TextBox subclasses, but is probably less useful here since you have control over things like min/max and the actual number format.
Yes, you can always write your own JS to test "isValid()" on your widget instance before submission, e.g. in an HTML FORM onSubmit handler, or you could use dijit.form.Form which will check validity for you. The widget itself is only responsible for visual representation of its own validity, according to the options chosen.
HTH