We Keep Coding

Enable / Disable button depending on two inputs

I have two inputs i want if one of them is equal to the other the button will be enabled else it's disabled.
I managed to do it in Ajax, but i need to do it in Javascript
$(':password').keyup(function() {
if($('#pass').val() == $('#pass1').val() && $('#pass').val()!=='') {
$('#go').removeAttr('disabled');
} else {
$('#go').attr('disabled', true);
}
});

This should work. It's your script "translated" to vanilla JavaScript.
document.querySelector(':password').addEventListener('keypress', function() {
if (document.querySelector('#pass').value == document.querySelector('#pass1').value && document.querySelector('#pass').value !== '') {
document.querySelector('#go').disabled = false;
} else {
document.querySelector('#go').disabled = true;
}
});

I created a JSFiddle for you, implementing that functionality in plain JS: https://jsfiddle.net/3m9g4p0h/4/
JS:
var pw1 = document.getElementById('pw1');
var pw2 = document.getElementById('pw2');
var button = document.getElementById('button');
function compare() {
button.disabled = pw1.value !== pw2.value || pw1 === '';
}
pw1.addEventListener('keyup', compare);
pw2.addEventListener('keyup', compare);
HTML:
<input type="password" id="pw1" />
<input type="password" id="pw2" />
<button id="button" disabled="true">
Click me
</button>

You are looking for form validation functionality.
There are a lot of plugins and libs for this kind of task.
but there is a simple example
function getElements(){
return {
password: document.querySelector('input[name="password"]'),
confirm: document.querySelector('input[name="passwordConfirm"]'),
button: document.querySelector('button'),
}
}
function validate(){
let els = getElements();
els.button.disabled = els.password.value !== els.confirm.value;
}
let elements = getElements();
elements.password.addEventListener('input', validate);
elements.confirm.addEventListener('input', validate);
validate();
<input name="password" type="password" placeholder="password...">
<input name="passwordConfirm" type="password" placeholder="password confirm...">
<button type="submit">submit</button>
and jQuery variant
function validate(event){
let $frm = $(event.target).closest('form');
let pas = $frm.find('input[name="password"]');
let conf = $frm.find('input[name="passwordConfirm"]');
let btn = $frm.find('button');
btn.prop('disabled', pas.val() !== conf.val());
}
let $frm = $('form');
$frm.on('input', validate);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<form>
<input name="password" type="password" placeholder="password...">
<input name="passwordConfirm" type="password" placeholder="password confirm...">
<button type="submit">submit</button>
</form>

Make input fields case insensitive in JavaScript

I have a problem with my code, namely: If in input #search_code I introduce letter 'm' and in #insert_code input I introduce letter "M", function returns "is not ok". I tried to make uppercase inputs with CSS text-transform: uppercase; but it does not work. What can we do to make input fields case insensitive?
var search_code = document.getElementById('search_code');
var insert_code = document.getElementById('insert_code');
var result = document.getElementById('result');
var button = document.getElementById('button');
var audio = new Audio('sound.wav');
// respond to button click
button.onclick = function validate(e) {
e.preventDefault();
// show verification result:
if (search_code.value == insert_code.value) {
result.textContent = 'code ok';
result.className = "ok";
audio.play();
} else {
result.textContent = 'code is not ok';
result.className = "not-ok";
}
// clear input when wrong:
if (search_code.value !== insert_code.value) {
insert_code.value = '';
}
return false;
};
function clearField(input) {
input.value = "";
};
$(document).ready(function(){
$('#search_code').bind("cut copy paste",function(e) {
e.preventDefault();
});
});
...
<form>
<input type="text" name="search_code" onfocus="clearField(this, this.placeholder='');" onblur="this.placeholder='introdu codul'" id="search_code" placeholder="introdu codul" autocomplete="off" value=""/><br/>
<input type="" name="insert_code" onfocus="clearField(this, this.placeholder='');" onblur="this.placeholder='scaneaza codul'" id="insert_code" placeholder="scaneaza codul" autocomplete="off" value=""/><br/><br/>
<input type="submit" id="button" name="button" value="verifica COD" />
</form>
</div>
<div id="result"></div>
</div>
<script src="js/action_input.js"></script>
</body>
</html>

Convert those values to be compared to lowercase so that case sensitivity is no longer an issue.
var search_code = document.getElementById('search_code');
var insert_code = document.getElementById('insert_code');
var result = document.getElementById('result');
var button = document.getElementById('button');
var audio = new Audio('sound.wav');
// respond to button click
button.onclick = function validate(e) {
e.preventDefault();
// show verification result:
if (search_code.value.toLowerCase() == insert_code.value.toLowerCase()) {
result.textContent = 'code ok';
result.className = "ok";
audio.play();
} else {
result.textContent = 'code is not ok';
result.className = "not-ok";
}
// clear input when wrong:
if (search_code.value.toLowerCase() !== insert_code.value.toLowerCase()) {
insert_code.value = '';
}
return false;
};
function clearField(input) {
input.value = "";
};
$(document).ready(function() {
$('#search_code').bind("cut copy paste", function(e) {
e.preventDefault();
});
});
<form>
<input type="text" name="search_code" onfocus="clearField(this, this.placeholder='');" onblur="this.placeholder='introdu codul'" id="search_code" placeholder="introdu codul" autocomplete="off" value="" /><br/>
<input type="" name="insert_code" onfocus="clearField(this, this.placeholder='');" onblur="this.placeholder='scaneaza codul'" id="insert_code" placeholder="scaneaza codul" autocomplete="off" value="" /><br/><br/>
<input type="submit" id="button" name="button" value="verifica COD" />
</form>
<div id="result"></div>

You should be checking the variables for quality by first converting them into either upper or lower case. You can use String's "toLowerCase()" before comparisions.(If you need case insensitive comparision)
search_code.value.toLowerCase() == insert_code.value.toLowerCase()

Modify your condition check to as below
if (search_code.value.toLowerCase() == insert_code.value.toLowerCase()) {
That should make it run with no issues

Jquery on keypress

I'm looking for a function that gives an alert when a certain character key (g) is pressed in the first position of a postal code, and then disables the submit button if the postal code has a letter G in the beginning.
Is this possible?
My current code to detect a key up on the postal code field at the moment is this:
$(document).ready(function() {
var someTextInputField = "#postal-code";
$(someTextInputField).on("keyup", function() {
alert('not a valid postal code');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="postal-code" />

Javascript without extra libraries
document.addEventListener("input", function(e) {
if (e.target.id === "postal-code") {
var disable = /^g/i.test(e.target.value),
submit = document.getElementById("submit");
if (disable && !submit.disabled) {
alert("You cannot start a postal code with a G");
}
submit.disabled = disable;
}
});
<input placeholder="Address" />
<input id="postal-code" placeholder="Postal Code" />
<button id="submit">Submit</button>
jQuery
$(document).on("input", "#postal-code", function (e) {
var disable = /^g/i.test(this.value),
$submit = $("#submit");
if (disable && !$submit.prop("disabled")) {
alert("You cannot start a postal code with a G");
}
$submit.prop("disabled", disable);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input placeholder="Address" />
<input id="postal-code" placeholder="Postal Code" />
<button id="submit">Submit</button>

Check this fiddle http://jsfiddle.net/oyc2L9sy/12/
html:
<input id="test" type="text" />
javascript:
$(document).ready(function() {
$("#test").on("keypress", function(e) {
if ((e.keyCode == '65') ||
(e.keyCode == '71')) {
alert('not a valid postal code');
return false;
}
});
});

You can use this.value[0] to get the first character of the input. Then test whether it's one of the allowed characters.
$("#input").on("keyup", function() {
if (this.value != '') {
var firstchar = this.value[0].toUpperCase();
if (firstchar != 'A' && firstchar != 'G') {
alert('not a valid postal code');
$("#submitID").prop("disabled", true);
} else {
$("#submitID").prop("disabled", false);
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="input"/>

Check all fields together?

There are three field. i want check each a of field if have value, show class .koko. if on all field not have value, hide class .koko.
How is it?
in the this code, each field is check separate but i want check all fields together:
<input type="text" name="ok" class="ko" value="">
<input type="text" name="ok" class="ko" value="">
<input type="text" name="ok" class="ko" value="">
<div class="koko" style="display: none;">Hello, how are you?</div>
$('.ko').live("keyup", function () {
var $val = $(this).val();
$('.koko').show();
if ($val == '') {
$('.koko').hide()
}
});
DEMO

You could do it this way:
$('.ko').live("keyup", function () {
var $val = $(this).val();
$('.koko').show();
var collectiveValue = '';
$('.ko').each(function(){collectiveValue += this.value})
if(collectiveValue.length == 0)
$('.koko').hide();
});
http://jsfiddle.net/abdQc/

$('.ko').live("keyup", function () {
var showOrHide = $(".ko[value^='']").length >= 0;
$('.koko').toggle(showOrHide);
});

jquery - Add exception onclick

I have the following input fields:
<input type="text" value="5" maxlength="12" id="qty" class="input-text qty" name="qty2050" tabindex="1">
and
<input type="text" value="0" maxlength="12" id="qty" class="input-text qty" name="qty2042" tabindex="1">
I use this code to prevent the user from losing inserted data (upon quitting the page):
<script>
window.onbeforeunload = function() {
var showAlert = false;
jQuery('.input-text.qty').each(function (){
//console.log("fonction 1");
var val = parseInt(jQuery(this).val(),10);
if(val > 0) { showAlert = true; }
//alert(val);
});
//console.log("fonction 2");
//console.log(showAlert);
if (showAlert == true) {
console.log("fonction 3");
return 'You have unsaved changes!';
}
}
</script>
I want to add an exception to my submit button, and to not show the alert message when there is a quantity > 0 in one of my input fields.
My problem is in adding this exception!
Thanks for help.

You can use bool confirmUnload. Like here: http://jonstjohn.com/node/23
<script>
var confirmUnload = true;
$("submit").click(function(){ confirmUnload = false; });
window.onbeforeunload = function() {
if (confirmUnload)
{
var showAlert = false;
jQuery('.input-text.qty').each(function (){
//console.log("fonction 1");
var val = parseInt(jQuery(this).val(),10);
if(val > 0) { showAlert = true; }
//alert(val);
});
//console.log("fonction 2");
//console.log(showAlert);
if (showAlert == true) {
console.log("fonction 3");
return 'You have unsaved changes!';
}
}
}
</script>

is this what you want:
<SCRIPT>
function checkForm(e) {
if (!(window.confirm("Do you want to submit the form?")))
e.returnValue = false;
}
</SCRIPT>
</HEAD>
<BODY>
<FORM name="theForm" action="0801.html"
onSubmit = "return checkForm(event)">
<INPUT type=submit>
</FORM>
your checks will go into the checkForm method in this case