Develop Reference

JavaScript form validation, check if string contains

I have some form validation on my website.
If the account code field contains "XXX" and the reference field is blank, I want an alert to come up for the user to populate the reference field.
I have read that indexOf is the function I need, but the code below does not appear to work. Any ideas?
<SCRIPT>
if (form.account.value.indexOf("XXX") != -1 & form.reference.value == "") {
alert("Please Enter Reference Number");
form.reference.focus( );
return false;
}
</script>

Can you try:
if (form.account.value.indexOf("XXX") != -1 && form.reference.value == "") {
alert("Please Enter Reference Number");
form.reference.focus( );
return false;
}
This corrects the AND clause, which uses && not &.

jQuery validation not performing correctly

I am checking whether someone has selected a property type (house/flat) and then checking the sub list of either houses or flats to see whether they have selected a sub-type of there selected property (ie. house -> semi-detached etc.)
The house validation is working fine, the flats validation isn't however even though their syntax is the same, I feel like I'm missing something really obvious here.
jsfiddle: http://jsfiddle.net/dyates88/vCmnW/iddle
jQuery:
valid = true;
if (index === 2) {
if (!$("#htype div").hasClass("selected")) {
alert("Please select a Property type!");
valid = false;
} else if ($("#htype div").attr('sel') == 'true' && $("#htype div").attr('id') == 'flat' && !$("#flats div").hasClass("selected")) {
alert("Please Select a flat type!");
valid = false;
} else if ($("#htype div").attr('sel') == 'true' && $("#htype div").attr('id') == 'house' && !$("#houses div").hasClass("selected")) {
alert("Please Select a house type!");
valid = false;
}

Javascript Conditions are Executing Either Way

please help me out on this, I realy don't figure out where is the problem.
my code:
function validateForm()
{
var pic = document.getElementById("photo1").value;
pic = pic.split('/').pop().split('\\').pop().replace(/[.][^.]+$/, "");
var x = document.getElementById("gyuruszam");
var gyuru = document.getElementById("gyuruszam").value;
if (gyuru == null || gyuru == "" || gyuru == " ")
{
alert("Gyűrűszám nélkül nem lehet adatot lementeni!");
x.focus();
x.style.borderColor="#C30";
return false;
}
if ((gyuru != pic) && (pic != NULL)){
alert("A kép neve nem egyezik meg a gyűrűszámal!");
return false;
}
}
I don't know why is executing the second if, if I do not select file on the field.
I just want an if condition, if I select file and the gyuru is not equal with the name of the file, then return false with an error message. But if I don't select a file return true(ornot even entering in the loop)
Thank you in advance!
EDIT:
I also try this way:
function validateForm()
{
var pic = document.getElementById("photo1").value;
pic = pic.split('/').pop().split('\\').pop().replace(/[.][^.]+$/, "");
var x = document.getElementById("gyuruszam");
var gyuru = document.getElementById("gyuruszam").value;
if (gyuru == null || gyuru == "" || gyuru == " ")
{
alert("Gyűrűszám nélkül nem lehet adatot lementeni!");
x.focus();
x.style.borderColor="#C30";
return false;
}
else if ((gyuru != pic) && (pic != NULL)){
alert("A kép neve nem egyezik meg a gyűrűszámal!");
return false;
}
}
it's working, but not like I want, because if I upload a file with different name, not equal with gyuru it's return true.
my form data is:
<form...
<input type="text" id="gyuruszam" name="gyuruszam"/>
<input type="file" id="photo1" name="photo1"/>
../form>
AND i CHECK THE RETURNED FILE NAME pic IT'S CORRECT!

I'm sorry I'm not sure of what you want.
Your code has a mistake, NULL does not exists, you should put null.
Second problem: pic cannot be null, it will be an empty string if you don't select a file.
So I guess you are looking for:
} else if ((gyuru != pic) && (pic != null) && (pic != '')) {
Try it here: http://jsfiddle.net/nyothecat/ALjGJ/

How to change textContent via javascript?

I have a registration form page, and there is empty div i want to use to display errors. To check forms before triggering php script i use javascript:
function errorHandler(){
var loginIn;
var passIn;
loginIn = document.forms["regForm"]["login"].value;
passIn = document.forms["regForm"]["password"].value;
if (loginIn == "" || loginIn == null) {
alert("LOGIN CANNOT BE EMPTY");
return false;
}
}
It works fine, and alert message do appear when i call them like this:
<form name="regForm" action= "save_user.php" onsubmit="return errorHandler()" method="post">.
But there is as i mentioned before a div inside of the form: div id ="errorArea"></div> and when i try to put a text inside of this div like this:
function errorHandler(){
var loginIn;
var passIn;
var erorAreaMessage;
loginIn = document.forms["regForm"]["login"].value;
passIn = document.forms["regForm"]["password"].value;
erorAreaMessage = document.getElementById('errorArea').textContent;
if (loginIn == "" || loginIn == null) {
erorAreaMessage = "LOGIN CANNOT BE EMPTY";
return false;
}
}
Nothing happens, can someone explain me why?

You need to put the value inside the <div>. That can done by setting the innerHTML or textContent property to your error-message.
Try this -
...
if (loginIn == "" || loginIn == null) {
document.getElementById('errorArea').textContent = "LOGIN CANNOT BE EMPTY";
return false;
}}

Adding an if statement inside if statement

I have a function for a button which submits a form. This function checks to see if the 5 checkboxes are selected #co1,#co2,#co3,#div1,#cc1.
It then also checks to see if tcaccept select is set to 1.
If so the form submits, else the alert pops up.
This is the code i have at the moment:
$('#submit2pd').click(function(event) {
var $finishBoxes = $('#co1,#co2,#co3,#div1,#cc1');
if (!($finishBoxes.length == $finishBoxes.filter(':checked').length && $('#tcaccept').val() == '1' )) {
alert('Please complete the Induction Checklist confirming that you have read and understood the Colleges main policies and procedures, agreeing to comply with these in line with the terms of your contract with the College');
return false;
}
// otherwise the form is submitted
window.location.href = "submit2pd.php";
});
All works brilliantly, but i want to add to this line as i have another option that is required. But this needs to be an if statement.
if (!($finishBoxes.length == $finishBoxes.filter(':checked').length && $('#tcaccept').val() == '1' && THE IF STATEMENT))
this is what i need to incorporate into the if statement above.
if ($("#ctl").val() == "1") {
$('#ctlapp') must not be blank
}
else if ($("#ctl").val() == "0") {
$('#ctlapp') can be blank
}
Any help would be greatly appreciated.

How about:
if (!($finishBoxes.length == $finishBoxes.filter(':checked').length &&
$('#tcaccept').val() == '1' &&
!($("#ctl").val() == "1" && $('#ctlapp').val() === "")))
What we're adding here is another condition which says, "And make sure it's not the case that #ctl is 1, and #ctlapp is blank".
Edit: and please see my comment above - your question is not about jQuery, forms, or validation. It's barely about JS.

if($('#tcaccept').val() == '1' && validate()) {
// do something
}
var validate = function(){
if ($("#ctl").val() == "1") {
$('#ctlapp') must not be blank
return false;
}
else if ($("#ctl").val() == "0") {
$('#ctlapp') can be blank;
return true;
}
return true;
}

I'd say clean up the code a little, and things will get a bit simpler:
$('#submit2pd').click(function(event) {
var fail_message = 'Please complete the Induction Checklist confirming that you have read and understood the Colleges main policies and procedures, agreeing to comply with these in line with the terms of your contract with the College',
$finishBoxes = $('#co1,#co2,#co3,#div1,#cc1'),
$checkedBoxes = $finishBoxes.filter(':checked'),
tcaccept = $('#tcaccept').val(),
ctl = $("#ctl").val(),
ctlapp = $('#ctlapp').val();
if (tcaccept == '1' && $finishBoxes.length != $checkedBoxes.length ) {
alert( fail_message );
return false;
} else if( ctl == "1" && ctlapp == "" ) {
alert( "some other message" );
return false;
}
// otherwise the form is submitted
window.location.href = "submit2pd.php";
});
I left the test for $('#ctl').val() == "0" out because it sounds like that's the only other value it can have, and there's no validation that needs to take place if it is "0".

Use a logic or || to capture both constalations:
$("#ctl").val() == "1" && $('#ctlapp') != ""
OR
$("#ctl").val() == "0"
if (
!(
$finishBoxes.length == $finishBoxes.filter(':checked').length
&&
$('#tcaccept').val() == '1'
&&
(
($("#ctl").val() == "1" && $('#ctlapp') != "")
||
$("#ctl").val() == "0"
)
)
)