Develop Reference

How to remove auto suggestion from an input tag

I need someone to please tell me how to remove this auto-suggested text below the input field. I have tried autocomplete="off" , autocomplete="false". I've also placed <form autocomplete="off"></form> in form tag.
Anyone with a solution please help.
<div class="col-md-6">
<div class="form-group">
<span class="label">Enter Postal Code</span>
<input type="text" class="form-control" id="search_input" autocomplete="off" placeholder="Type postal code ..." required>
</div>
</div>

Here you can see which browsers support the autofill attribute CaniUse. Here is a simple work around from this source: Turning off form-autocompletion.
You can work around with autofill="new-password"
"If you are defining a user management page where a user can specify a new password for another person, and therefore you want to prevent autofilling of password fields, you can use autocomplete="new-password"."
<form method="post" action="/form">
<div>
<label for="cc">Enter Postal Code:</label>
<input type="text" id="cc" name="cc" autocomplete="new-password">
</div>
</form>
Lastly, instead of pairing a <span> with the input element, it is common practice to use the <label> element. Please read more here label

Apply autocomplete="off" to your form not the input box.

form with input attributes 'required' and 'pattern' doesn't work

Hi i have this code with HTML5:
<form id="pay" method="GET" class="row g-3" style="display:none;" type="hidden">
<strong>Date</strong></a><br>
<div class="col-md-10">
<label for="name_users_card" class="form-label">user card</label>
<input type="text" class="form-control" id="name_users_card"
pattern="^[A-Za-zèòà\s]$"
minlength="3"
maxlength="20"
placeholder="titolare carta"
title="take a valid name" required/>
</div>
</form>
When I try to run the code, the required control is not working. Why?

don't actually understand the problem but you have an incomplete <a> tag and you made your form hidden by setting display:none;

Your Regular Expression Pattern:
^[A-Za-zèòà\s]$
is a single character.
If you want zero to any number of characters, use:
^[A-Za-zèòà\s]*$
If you want one to any number of characters, use:
^[A-Za-zèòà\s]+$
If you want exactly twenty characters, use:
^[A-Za-zèòà\s]{20}$
If you want three to twenty characters, use:
^[A-Za-zèòà\s]{3,20}$
If you want three to any number of characters, use:
^[A-Za-zèòà\s]{3,}$

In Cypress how to select input element based on name?

I'm starting to learn Cypress. I want to select the input field and provide the phone number by using cypress.io. The code I have following but it does not work. However can I using find or there is another way to get the input element to type in phone number?
cy.get('div').contains('Phone Number').find('input[name=teacher[0].number]').type('8000-1612023')
<div class="required field">
<label>Phone Number</label>
<div title="Teacher number" class="ui fluid right labeled input no-spinners">
<input required="" type="number" name="teacher[0].number" value="">
<div class="ui label label">US</div>
</div>
</div>

Why don't you directly target the input field using the following code
cy.get('input[name="teacher[0].number"]').type('8000-1612023')
Please find the screenshot below for a successful test. I would also recommend you to change the type of input in your HTML to tel
HTML:
<input required="" type="tel" name="teacher[0].number" value="">
Cypress:
describe('Trial', function() {
it('Test', function() {
cy.visit('http://localhost:8080/trials/')
cy.get('input[name="teacher[0].number"]').type('8000-1612023')
})
});
Test Result:

Try this instead:
cy.contains('div', 'Phone Number').find('input').first().type('8000-1612023')
The first argument to contains tells cypress to find the element with that selector that contains the text.

I write selectors with the input tag as below and it worked for me.
cy.get('input[name="elementName"]').type(val)
Check this to learn best practices when selecting elements:
https://docs.cypress.io/guides/references/best-practices#Selecting-Elements

AngularJS: ng-pattern to check for integer input

I'm stumped by the following problem. I have the following html input using AngularJS:
<input class="form-control" type="number" name="widgetQuantity" id="widgetQuantity"
ng-model="finalWidget.quantity" placeholder="Enter A Number" min="1"
ng-pattern="/^\d+$/" required/>
<p ng-show="widgetForm.widgetQuantity.$error.min" class="help-block">
You gotta order at least one.</p>
<p ng-show="widgetForm.widgetQuantity.$error.pattern" class="help-block">
No partial widgets, please.</p>
The ng-pattern directive catches the negative symbol and decimals, but it's not catching "e" input into the form. Any thoughts? Thanks!

Removing the type="number" requirement in the input field solved this issue -- apparently HTML validation will override errors from the angular side.

AngularJs ng-repeat form validation

I am using AngularJS 1.4.7. I am using an ng-repeat in a div surrounded by form as follows
<form name="myForm">
<div ng-repeat="product in ProductList">
<input name="ProductName" ng-model="ProductName">
</div>
</form>
When i validate errors show up on all the ProductNames even if its valid, i know i have to use ng-form but i can not get it to work
The Angular docs were not enough. And could not find a solution that works
Thanks

it's not a validation issue, you just have each input assigned to the same model. Try
<input name="ProductName[{{$index}}]" ng-model="product.name">

change your line one to this :
<form name="myForm" novalidate>