Mobile keyboard turn off input autosuggestion - ionic-framework

how can I turn off autosuggestion strip above the mobile keyboard in Ionic?
I've already tried:
<input type="text" name="username" id="username"
class="form-control" placeholder="Enter your user name"
value=""
autocapitalize="off"
autocomplete="off"
spellcheck="false"
autocorrect="off" />
but none of these works.
The same problem persists for <ion-input>.

Related

Razor Pages Password Input Box Keeps Displaying Default Dots

Built Add and Edit pages in .NET Core 3.1 Razor pages. When Edit page displays, both the "Password" and "Confirm Password" input boxes render empty as they should. When the Add pages displays, the "Confirm Password" input renders empty but the "Password" input renders with 15 default dots already entered. The input box code seems exactly the same on both pages:
<div class="form-group">
<label asp-for="User.user_password"></label>
<input type="password" class="form-control" asp-for="User.user_password" />
<span asp-validation-for="User.user_password"></span>
</div>
<div class="form-group">
<label asp-for="User.confirm_password"></label>
<input type="password" class="form-control" asp-for="User.confirm_password" />
<span asp-validation-for="User.confirm_password"></span>
</div>
Tried adding value="" but it still rendered the default dots. I'm not populating the inputs on the backend with anything. Any ideas?
Update on my comment.
If problem is in browser autofill, you could try to clear autofill for that domain.
How to clear saved auto fill passwords in chrome
add autocomplete="off" to html
<input type="password" class="form-control" asp-for="User.confirm_password" autocomplete="off" />

Angular logging click 2 times on one click

I'm trying to create 2 buttons, power on and power off, that have click events for their respected statuses. I have them as radio buttons, but i wanted them to be submitted on click without a submit button, like a switch. So i decide to just have them as pseudo forms, and add click listeners to each to release the event data.
I was testing this by logging the click, and when i click on, the console logs 2 clicks, despite clicking it once.
component snippet
onClick(data: any) {
console.log('click');
}
html snippet
<div class="btn-group" data-toggle="buttons">
<label
class="power-toggle on btn btn-lg btn-success"
(click)="onClick($event)"
>
<input type="radio" name="power" value="power-on" autocomplete="off">
ON
</label>
<label
class="power-toggle off btn btn-lg btn-danger active"
(click)="onClick('off')"
>
<input type="radio" name="power" value="power-off" autocomplete="off" checked>
OFF
</label>
</div>
why is this happening? how can i fix it? is there a way to submit the radio value as is without a submit button or turning the button into a submit button?
You need to bind the click function to the input and not the label.
Please find the plunker example here : https://plnkr.co/edit/Fmhs8xQupAynJfmwtk5y
<div class="btn-group" data-toggle="buttons">
<label
class="power-toggle on btn btn-lg btn-success"
>
<input (click)="onClick($event)" type="radio" name="power" value="power-on" autocomplete="off">
ON
</label>
<label
class="power-toggle off btn btn-lg btn-danger active"
>
<input (click)="onClick('off')" type="radio" name="power" value="power-off" autocomplete="off" checked>
OFF
</label>
</div>

Flat-UI & AngularJS Radio Input Form Functionality

Using Flat-ui with a form that contains some radio inputs which changes the format from standard bootstrap <input type="radio"... format to the following:
<label class="radio">
<input type="radio" name="group1" value="1" data-toggle="radio">
Radio is off
</label>
<label class="radio">
<input type="radio" name="group1" value="2" data-toggle="radio" checked>
Radio is on
</label>
The problem is when I use AngularJS to process the form the values are not being stored in the associated object:
<label class="radio">
<input type="radio" name="group1" value="1" data-toggle="radio" data-ng-model="regForm.accountType">
Radio is off
</label>
<label class="radio">
<input type="radio" name="group1" value="2" data-toggle="radio" data-ng-model="regForm.accountType">
Radio is on
</label>
As an aside: The radios' images are not appearing until after they are toggled? Has anyone else has this problem with flat-ui's kit?
Here is solution for this problem.
https://gist.github.com/petehamilton/5993366
Another solution is to don't preventDefault event
https://github.com/designmodo/Flat-UI/issues/57

submit on enter multiple inputs

I have one input field that submits on pressing enter, like so:
<form action="" method="POST" >
<input type="text" name="name"/>
<input type="submit" style="display:none;" />
</form>
But when I add another field, pressing enter doesn't do anything:
<form action="" method="POST" >
<input type="text" name="name"/>
<input type="text" name="message"/>
<input type="submit" style="display:none;" />
</form>
Why not? How can this be resolved?
Thanks a lot!
I wouldn't use display:none.
I think you wanted visibility: hidden.
At any rate, I wouldn't use either. If you do not want a submit button I would first moved those / after the input names one space to the right and then use a hack suggested on SO.
<form action="index.php" method="POST" >
<input type="text" name="name" />
<input type="text" name="message" />
<input type="submit" style="position: absolute; left: -9999px;
width: 1px; height: 1px;"/>
</form>
Also, please check out this Question as it has some great Answers on it.
Submitting a form by pressing enter without a submit button

In xhtml is this correct syntax of unchecked radio button

In XHTML I know that this is correct for a checked radion button:
<input type="radio" checked="checked" name="bar" value="baz" />
And absence of the checked attribute means that the radio button is unchecked:
<input type="radio" name="bar" value="baz" />
But would this be correct for unchecked radio button as well:
<input type="radio" checked="" name="bar" value="baz" />
No actually using
<input type="radio" checked="" name="bar" value="baz" />
will also render the checkbox checked in the browsers i've seen (how strange it might look)!