jquery-ui dialog password already filled at open - passwords

As wanted, dialog box for login is opened, but password is already filled in, although I put password field with value=""
<div id="dialog" title="Connexion aux données">
<form>
<fieldset class="ui-helper-reset">
<br>
<div>Nom du foyer</div>
<input type="text" name="foyer" id="foyer" value="" class="ui-widget-content ui-corner-all"><br>
<div>Mot de passe</div>
<input type="password" name="password" id="password" value="" class="ui-widget-content ui-corner-all"><br>
<div style="font-size:0.6em;padding-top:6px;">Afficher les caractères</div>
<input type="checkbox" name="reveal" id="reveal" value="" class="ui-widget-content ui-corner-all" style="width:20px;">
</fieldset>
</form>
</div>
and Jquery code in head part
var $dialog = $( "#dialog" )
.dialog({
autoOpen: false,
modal: true,
resizable: false,
draggable: false,
close: function(event,ui) {
$(this).find('form')[0].reset();
}
});
$dialog.dialog('open');
I have also cleaned browser cache but nothing changed.
By clicking on reveal checkbox I saw password is the same I have used in previous dev for testing few months ago.
Why this happens and how to avoid it ?

This happened for me too. After debugging I found out that it was the password that browser had saved and it was loading it onto the password field on page load.
After clearing the saved password, I was able to get the empty password textbox.
This could be the case with you too.

Related

How to stay on the same page after a form submission integrated to a Google form

In my website i have a contact form, and i've integrated it with a Google form. I've added the google form's execute URL as the action URL so once its submitted the form is being populated with the form data. the way i have done it
But when its being submitted, its redirecting to a google form's response page. What i need is once its submitted, to stay on the same page and give an alert. Im not sure how to do this in vue js. Any suggestion will be appreciated.
the content on the redirected page
{"result":"success","data":"{\"name\":[\"sdvsdv\"],\"company\":[\"dsvdv\"]}"}
Form in vue js view
<form method="POST" id="appointment-form" action="https://script.google.com/macros/s/AKfycbzRHvjfmIZdwKnOm26PeFv64OyyyGAfcr68MxvYw/exec">
<div class="form-group">
<input type="text" placeholder="Your name" name="name" class="form-control" id="name" required>
</div>
<div class="form-group">
<input type="text" placeholder="Company name" name="company" class="form-control" id="company" required>
</div>
<buttontype="submit" class="btn btn-default btn-block form-submit-btn">Submit</button>
</form>
After read your code properly, i found many errors.
How are you saving input values?
To save, you have to use ```v-model directive````
I guess you save the input values in somewhere. To avoid your problem, you can add a method and call it on submit, and inside the method save your input values.

Vue Validator only after change / blur / submit

I'm using Vue for the first time, with Vue Validator. Here is an example of my code:
<label for="first_name">First name:
<span v-if="$validation1.first_name.required" class="invalid">Enter your first name.</span>
<input id="first_name" placeholder="e.g. Christopher" class="" v-validate:first_name="['required']" v-model="first_name" name="first_name" type="text">
</label>
The only issue at the moment is that when I land on the page with my form, the whole thing is covered in errors. Is there a way I can suppress the errors and only show them on input blur / form submit?
Argh, the Google-able word isn't about blur, or on submit – its about timing and initial:
http://vuejs.github.io/vue-validator/en/timing.html
<input id="first_name" initial="off" placeholder="e.g. Christopher" class="" v-validate:first_name="['required']" v-model="first_name" name="first_name" type="text">
you need to add .dirty or .touched to your validation
<label for="first_name">First name:
<span v-if="$validation1.first_name.required && $validation1.first_name.touched" class="invalid">Enter your first name.</span>
<input id="first_name" placeholder="e.g. Christopher" class="" v-validate:first_name="['required']" v-model="first_name" name="first_name" type="text">
</label>
I was dealing with a similar problem. I had to have an initialized variable for the input name: "" but I also wanted to have a required attribute in element.
So I add required when the event onblur occurs.
<input name="name" type="number" v-model="name" #blur="addRequired" />
const app = Vue.createApp({
data() {
return {
name: ""
}
},
methods:{
addRequired: function(event){
event.target.setAttribute("required", true);
}
}
});

Element not being disabled

I have previously successfully implement this behaviour but for some reason it's not working. I am fairly new to Vue.js and I might be missing something.
I have two radio buttons as such:
<div class="radio">
<label>
<input type="radio" name="loginRadio" id="frmLoginRadio" value="true" v-model="loginRadio" checked>
No, I am new to this site
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="loginRadio" id="frmRegisterRadio" value="false" v-model="loginRadio">
Yes, my password is:
</label>
</div>
They both have a v-model of loginRadio which is initially set to false. When the second radio button is clicked, the disabled input button below should be enabled again.
<input type="password" class="form-control" name="password" :disabled="loginRadio">
However, for some reason, the only thing that is happening is this (when I used Chrome Debug)
<input type="password" class="form-control" name="password" disabled="false">
and the element stays disabled. What am I doing wrong?
You did not use v-bind:for the value attribute of the input buttons
Therefore, loginRadio does not contain boolean values true or false (depending on selection), but strings: "true" and "false"
it should be enough to properly bind the value attribute on both input buttons:
:value="true"
:value="false"

Worklight Disable password save

Im trying to disable the "Do you want the browser to remember this password" popup of the webview,
I added the line
this.appView.getSettings().setSaveFormData(false);
In the onCreate, before the loadURL command. But it does suppress the save password info feature.
ADDITION:
This is happening when the user submits their login information in the login form on my app:
<form onsubmit="dojo.byId('passwordLogin').blur();return false;">
<input id="emailAddressLogin" type="email" data-dojo-type="dojox.mobile.TextBox" placeholder="Email Address" value="" selectOnClick="true"></input>
<input id="passwordLogin" type="password" data-dojo-type="dojox.mobile.TextBox" placeholder="Password" value="" selectOnClick="true"></input>
<br/>
<button data-dojo-type="dojox.mobile.Button" type="submit" class="baseBtn navyBtn loginButton" onClick="processLoginAuthentication()">Login</button>
</form>
I believe the following should work:
this.appView.getSettings().setSavePassword(false);

text fade on input field, where is this being configured

i have this website im building, my client is using a template and the template has contact forms, now i cant seem to understand how to get the text fade on click for input fields to work on any additional fields i make on top of what was there on the template.
http://daniloportal.com/NPC2/contact.html
on that page take a look at the form, the values with *'s disappear but the clone EMAIL input i made doesnt cause i took the * off the value.
Ive been going crazy trying to figure out where this is being configured on the page, If any inspect elementors can take a look and let me know i would greatly appreciate it!
this is the code snip
<form id="ajax-contact-form" action="">
<input type="text" name="name" value="Name *" title="Name *" />
<input type="text" name="email" value="Email *" title="Email *" />
<input type="text" name="email" value="Email " title="Email *" />
<textarea name="message" id="message" title="Message *">Message *</textarea>
<div class="clear"></div>
<input type="reset" class="btn btn_clear" value="Clear form" />
<input type="submit" class="btn btn_blue btn_send" value="Send message!" />
<div class="clear"></div>
</form>
Search your code to find what makes the input's value disappear. E.g., look for behavior that clears the value of form fields (either element.value = '' if using plain javascript, or element.val('') if using jquery).
Then you can see what is the condition to clearing it. In your case, seems that the condition is that the input's value is equal to it's "title" attribute (you can edit both using "Inspect Element" in Chrome).