Using SimpleTest, how would I check the third checkbox if they all share the same name?
<input type='checkbox' class='style' name='same' value="First" />
<input type='checkbox' class='style' name='same' value="Second" />
<input type='checkbox' class='style' name='same' value="Third" />
<input type='checkbox' class='style' name='same' value="Forth" />
Alternatively, when I get() the URL using SimpleTest, can I somehow add ID's to the inputs?
I have figured it out. This toggled the correct box..
$browser->setField("same", array("Third"));
Related
I have a react sign-up form. I want to set up an input (checkbox) that holds the value as some text - e.g:
<form onSubmit={this.validateStepTwo} id="registerForm">
<label htmlFor="short_bio">Tell the users a bit about yourself:</label>
<input type="textarea" name="short_bio" className="textarea-small"/>
<label htmlFor="bio_info">Tell the users who you are</label>
<input type="textarea" name="bio_info" className="textarea-large"/>
<label htmlFor="bio_exp">Tell the users what you did</label>
<input type="textarea" name="bio_exp" className="textarea-large"/>
<input type="checkbox" name="instructor" value="I want to be an instructor" />
<input type="submit" value="Register" className="submit"></input>
{this.state.errors !== null ? (
<h1 className="error">{this.state.errors}</h1>
) : ('')}
</form>
Where
<input type="checkbox" name="instructor" value="I want to be an instructor" />
should have a value of "I want to be an instructor" but it doesnt have anything.
I tried doing it like this:
<input ...>I want to be an instructor</input>
but that threw another error.
Is this a react thing or am i missing something in my code? Ive been on the computer for 13 hours so i wouldnt be surprised if i made a dumb mistake.
Checkbox input value is the one sent in the request and not the text that appears afterwards.
If you want it to be the text then do something like this
<input type="checkbox" name="instructor" value="instructor"> I want to be an instructor
I have an input box and my model is undefined for somereason when I try to access it in controller.
Below is the input box
<input type="text" ng-if="primaryOperator == 'Age'"
ng-model="primaryValueData" placeholder="enter Value"
class="hideOutlineClass" />
when i try to access $scope.primaryValueData in controller it is undefined. I cannot use ng-show have to use ng-if. Any help is appreciated
Try like this,
<div ng-if="primaryOperator === 'Age'">
<input type="text"
ng-model="primaryValueData" placeholder="enter Value"
class="hideOutlineClass" />
</div>
<input id="declarationAcknowledgement" name="declarationAcknowledgement" ng-false-value="false" ng-model="formData.declarationAcknowledgement" ng-true-value="true" type="checkbox" />
<label data-localize="I Agree" for="declarationAcknowledgement" >I Agree</label>
<div class="pw-form-inline-error" data-localize="Accept to proceed" ng-show="(peopleworksForm.declarationAcknowledgement.$dirty || peopleworksForm.submited) && formData.declarationAcknowledgement != 'true'">Accept to proceed</div>
this is my view side inside my controller I set "Form.submited = true"
what I want is if the user check the check box if value is not equals to 'true' set the form.$valid false from view side not in controller how can I do this. Can any one help me?
try this.. add required="required" and make ng-false-value=""
<input required="required" name="declarationAcknowledgement" ng-false-value="" ng-model="formData.declarationAcknowledgement" ng-true-value="true" type="checkbox" />
Here is my code
This is static code.
<label for="lbitemname">Name</label>
<input type="text" id="lb-item-name" ng-model="lb.itemname1" />
These are dynamic, i.e they are added to DOM when I click add button on my page.
<label for="lbitemname">Name</label>
<input type="text" id="lb-item-name" ng-model="lb.itemname2" />
<label for="lbitemname">Name</label>
<input type="text" id="lb-item-name" ng-model="lb.itemname3" />
My problem is when I pass these values to controller.
lb.itemname2 and lb.itemname3 are undefined.
I created this simple example: http://jsfiddle.net/5Bh59/.
If you switch between AngularJS 1.2.1 and 1.1.1, you'll see the radio buttons don't work properly in either version. If you watch the radio button's $dirty field, 1) for version 1.1.1, it will only be set when the first button is clicked, and 2) for version 1.2.1, it will only be set when the last button is clicked.
I read this answer: AngularJS Radio group not setting $dirty on field but I don't really understand the answer. Not only that but the fiddler example demonstrates the same behavior.
So, is this a bug in AngularJS and how can I work around it?
You either need to give each radio button input a different name, or you need to wrap each radio button in an ng-form (each of which have a different name). If you use two inputs with the same name in the same form, only the last one will be bound to the property on the FormController. If you use different names, then each input will have its own property on the FormController.
Example with different names for each radio button:
http://jsfiddle.net/BEU3V/
<form name="form" novalidate>
<input type="radio"
name="myRadio1"
ng-model="myRadio"
ng-click=""
value="Rejected"
required>Rejected<br />
<input type="radio"
name="myRadio2"
ng-model="myRadio"
ng-click=""
value="Approved"
required>Approved<br />
Form $dirty: {{form.$dirty}}<br />
Field1 $dirty: {{form.myRadio1.$dirty}}<br />
Field1 $dirty: {{form.myRadio2.$dirty}}<br />
Value: {{myRadio}}
</form>
Example wrapping with ng-form:
http://jsfiddle.net/39Rrm/1/
<form name="form" novalidate>
<ng-form name="form1">
<input type="radio"
name="myRadio"
ng-model="myRadio"
ng-click=""
value="Rejected"
required>Rejected<br />
</ng-form>
<ng-form name="form2">
<input type="radio"
name="myRadio"
ng-model="myRadio"
ng-click=""
value="Approved"
required>Approved<br />
</ng-form>
Form $dirty: {{form.$dirty}}<br />
Field1 $dirty: {{form.form1.myRadio.$dirty}}<br />
Field2 $dirty: {{form.form2.myRadio.$dirty}}<br />
Value: {{myRadio}}
</form>
If you'd like a single check for the radio group, you can wrap all the radio buttons in their own ng-form and call it something like name="radioGroup".
http://jsfiddle.net/6VVBL/
<form name="form" novalidate>
<ng-form name="radioGroup">
<input type="radio"
name="myRadio1"
ng-model="myRadio"
ng-click=""
value="Rejected"
required>Rejected<br />
<input type="radio"
name="myRadio2"
ng-model="myRadio"
ng-click=""
value="Approved"
required>Approved<br />
</ng-form>
Form $dirty: {{form.$dirty}}<br />
Group $valid: {{form.radioGroup.$valid}}<br />
Group $dirty: {{form.radioGroup.$dirty}}<br />
Value: {{myRadio}}
</form>
This answer is related but perhaps not exactly applicable, but after finding and reading this item I felt it valuable to provide, and I don't have enough points to just comment on an answer (which I thought would have been a more appropriate way to respond).
My issue was that I wanted to show a required error (using ng-messages) but when you tabbed through / past the radio button group $touched didn't turn true unless you shift-tabbed back from the next UI element back to the last radio button of the group. (When my form renders the radio buttons are not set - I'm wanting the user to make a selection and not rely on the user accepting a default.)
Here's my code:
<div class="form-group" ng-class="{'has-error': pet.genderId.$invalid && pet.genderId.$touched}">
<label class="control-label">
What is your pet's gender?
<span ng-messages="pet.genderId.$error" ng-show="pet.genderId.$invalid && pet.genderId.$touched">
<span ng-message="required">(required)</span>
</span>
</label>
<div>
<label class="radio-inline"><input type="radio" ng-model="genderId" name="genderId" value="1" required ng-blur="pet.genderId.$setTouched();" />Male</label>
<label class="radio-inline"><input type="radio" ng-model="genderId" name="genderId" value="2" required ng-blur="pet.genderId.$setTouched();" />Female</label>
<label class="radio-inline"><input type="radio" ng-model="genderId" name="genderId" value="3" required ng-blur="pet.genderId.$setTouched();" />Not sure</label>
</div>
</div>
The 'magic' was adding the ng-blur attribute to set 'touched' myself even if only the first radio button was tabbed past.
You may be able to employ a similar tactic for $dirty by calling $setDirty() in the ng-changed attribute.