I'm programming a chrome extension and I need to autofill form an the current visited site. I find the code of the Bitwarden autofill scrut but I'm novice so I don't know how to implement it to my code. Also, the variables that have to complete the fields are in the script.js, and idk were the autofill should be.
Try adding this to your script.js:
function getPasswordInput() {
return document.querySelector('form input[type="password"]')
}
function getFormElement() {
var passwordInput = getPasswordInput()
while (!(passwordInput instanceof HTMLFormElement)) {
passwordInput = passwordInput.parentElement
}
return passwordInput
}
function getUsernameInput() {
return getFormElement().querySelector('input[type="text"]')
}
if (getPasswordInput()) {
getUsernameInput().value = 'YOUR_USERNAME'
getPasswordInput().value = 'YOUR_PASSWORD'
}
This code checks if there are any input elements on the site which have the type password. If so it will autofill the form. You just need to replace YOUR_USERNAME and YOUR_PASSWORD with the username and password.
Related
I am using a validation function in my form, that checks whether a field is empty or not. This works for normal text input boxes, but not for the Typeahead box.
I want to check if the Typeahead box is empty, and if it is, display an error message i.e. this.state.industryError
This is my state:
state = {
name: "",
industry: [],
nameError: "",
industryError: "",
}
And this is my Typeahead form element:
<Form>
<Label>Industry</Label>
<Typeahead
id="industryMultiSelect"
multiple
options={industries}
placeholder="Select industry..."
onChange={this.handleTypeaheadChangeIndustry} />
<div>
{this.state.industryError} // Where the error message appears
</div>
</Form>
My validate function is as follows:
validate = () => {
let nameError = "";
let industryError = "";
if(!this.state.name) { // Checks if field is empty
nameError = "Please enter a name";
}
if(this.state.industry === []) { // I think this is the problem
industryError = "Please enter an industry";
}
if (nameError || industryError) {
this.setState({nameError, industryError});
return false;
}
return true;
};
This is handleChange function I call for the typeahead:
handleTypeaheadChangeIndustry = selected => {
const industry = selected.map(option => option.value);
this.setState({industry})
};
It works fine with the name field because it equals an empty string. But with the Typeahead, it's not a string, and so I'm unsure what to set this.state.industry to.
Any help or advice is much appreciated, and I can quickly update my answer if you need more detail.
It's a little hard to pinpoint why your code isn't working without seeing everything. That said, I created a sandbox which I believe does what you're after using the code you posted above:
https://codesandbox.io/s/react-bootstrap-typeahead-form-validation-686qe
As #ravibagul91 notes, you should be using one of
if (this.state.industry.length === 0) { ... }
if (!this.state.industry.length) { ... }
rather than
if (this.state.industry === []) { ... }
Using the latter in the sandbox I posted causes the code not to work, while things work fine when using either of the first two.
So I have two fields in my webpage, one for telephone number and the other for email address, I need to make either one of them required to be filled by using JavaScript NOT jQuery. Most of the answers I found here are for jQuery, any solutions with JavaScript would be much appreciated. Thanks!
function User_one(){
var phone = document.getElementById('PhoneText2').value;
var mail = document.getElementById('EmailText1').value;
if (phone && mail == ""){
alert("An error occurred.");
}else{
return false;
}
}
Update with actual code
Here's how I'd do it
(function () {
document.getElementById('myForm').addEventListener('submit', function(event){
// Get the length of the values of each input
var phone = document.getElementById('PhoneText2').value.length,
email = document.getElementById('EmailText1').value.length;
// If both fields are empty stop the form from submitting
if( phone === 0 && email === 0 ) {
event.preventDefault();
}
}, false);
})();
Since you haven't supplied any code for us to work with, I'll answer in pseudo-code:
On form submission {
If (both telephone and email is empty) {
throw validation error
}
otherwise {
submit the form
}
}
If you show me your code I'll show you mine :-)
I have multiple input type text on jsp form for each the range is defined to the next input type textbox i want to validate with the defined range and if the value beyond the range validation function ask for pop confirmation if user enter userid in text that compare with session value ie 'user' then the validation function allow user to submit form with return true and not ask again for that filed validate .how can i achieve this using javascript function.any other way that can i achieve same using javascript .Request you to Suggest Option with example code.
JavaScript code:-
if(document.getElementById('pH'+formid).value !=0)
{
var user;
var value=document.getElementById('pH'+formid).value;
var maxmin=document.getElementById('pHspecf'+formid).value.split('-');
var max=maxmin[0];
var min=maxmin[1];
if(value<min||value>mix)
{
alert("max-"+max+" min-"+min+" value of parameter-"+value);
var c=confirm("Entered Value Beyond the Specification Range.\n DO you Still Want To continue Press Yes..!");
if (c==true)
{
var person=prompt("Please enter your Username","Your User name");
if (person!=null)
{user=person;
alert("Hello "+person+" Your Request Is Accepted..!");
}else{
document.getElementById('pH'+formid).style.backgroundColor = "lightblue";
document.getElementById('pH'+formid).focus();
return false;
}
}
else
{
document.getElementById('pH'+formid).focus();
return false;
}
}
}
As am not good with JS and Jquery, am struggling to add new validation rule to the Marketo form, which shows error message when tried to submit the form leaving any field empty along with I need to validate the FirstName and LastName fields to allow only the alphabetic characters and should through a error message when numeric characters are entered.
Below is my Marketo LP: http://qliktest.qlik.com/Vinu-Test1_Reg_Form.html
Here is an example of custom email validation. You can put the custom code in whenReady function.
MktoForms2.whenReady(function(form) {
function isEmailValid(email) {
RE_EMAIL_ASCII_PUBLIC = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+#[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+$/;
return RE_EMAIL_ASCII_PUBLIC.test(email);
}
form.onValidate(function() {
var values = form.vals();
if (values.Email) {
if (!isEmailValid(values.Email)) {
form.submitable(false);
var emailElem = form.getFormElem().find("#Email");
form.showErrorMessage(
// write your message here
"Must be valid email.",
emailElem
);
} else {
form.submitable(true);
}
}
});
If you mark the fields as "required" in Marketo there is already logic built in that will take care of the validation for you. If you want to create some custom validation logic, I.E. only allowing alphabetic characters in the fields, you need to use the Marketo Forms 2.0 Javascript API (http://developers.marketo.com/documentation/websites/forms-2-0/)
Here's an example of validating a Marketo form field using the API:
MktoForms2.whenReady(function (form) {
//listen for the validate event
form.onValidate(function() {
// Get the values
var vals = form.vals();
//Check your condition
if (vals.Country == "USA" && vals.vehicleSize != "Massive") {
// Prevent form submission
form.submittable(false);
// Show error message, pointed at VehicleSize element
var vehicleSizeElem = form.getFormElem().find("#vehicleSize");
form.showErrorMessage("All Americans must have a massive vehicle", vehicleSizeElem);
}
else {
// Enable submission for those who met the criteria
form.submittable(true);
} }); });
I am trying to make a simple web application. In my login page I have a form with a text field, a password and a submit button. Form submission is prevented if either fields are empty. This is the script I use:
function checkLoginCredentials() {
var usernameFormValue = $("#usernameForm").val().trim();
var passwordFormValue = $("#passwordForm").val().trim();
var validated;
$("#loginForm").submit(function(event){
if (usernameFormValue === "" || passwordFormValue === "") {
$("span").html("Enter a username or password");
validated = false
} else {
validated = true;
}
return validated;
});
}
However, I noticed that once the script runs and form submission is prevented, the user can no longer make an attempt to log in again. The only alternative I can think of is to have ALL validations done by my login servlet and utility classes. Is there a way around this or must validations of invalid entries like empty strings be done by my Java Classes?
The issue here is how you are assigning the validation code. You have a checkLoginCredentials and when you call it you read the form values. And than you add a form submission. You should add the reading of the textbox values inside of the submit method, not outside.
$("#loginForm").submit(function(event){
var usernameFormValue = $("#usernameForm").val().trim(),
passwordFormValue = $("#passwordForm").val().trim(),
validated;
if (usernameFormValue === "" || passwordFormValue === "") {
$("span").html("Enter a username or password");
validated = false
} else {
validated = true;
}
return validated;
});