Develop Reference

Show Validation in Signature field when field value is false?

I have to try to show validation when my signature field is blank. i am use alert message but it's not working like i am click on OK button and also show validation message but it's save form. So any one suggest me how to stop this continue show validation message if my field is blank and i have try to save.
My code is below :
on_save_sign: function(value_) {
var self = this;
this.$el.find('> img').remove();
var signature = self.$el.find(".signature").jSignature("getData",'image');
var is_empty = signature
? self.empty_sign[1] === signature[1]
: false;
if (! is_empty && typeof signature !== "undefined" && signature[1]) {
self.set('value',signature[1]);
}
else {
alert('Signature First');
self.do_warn(_t("Signature First"));
}
},

You can try following code.
on_save_sign: function(value_) {
var self = this;
this.$el.find('> img').remove();
var signature = self.$el.find(".signature").jSignature("getData",'image');
var is_empty = signature
? self.empty_sign[1] === signature[1]
: false;
if(is_empty){
self.do_warn("Please enter valid signature.")
}
if (! is_empty && typeof signature !== "undefined" && signature[1]) {
self.set('value',signature[1]);
}
},
Hope It will help you. If still not working try to use debug assets and reload the page. check your updated code is there by adding console in above conditions.
Have a good day !

on_save_sign: function(value_) {
this.$el.find('> img').remove();
var signature = this.$el.find(".signature").jSignature("getData", 'image');
var is_empty = signature
? this.empty_sign[1] === signature[1]
: false;
if (is_empty) {
this.do_warn("Please enter valid signature.")
}
else {
this.set('value', signature[1]);
}
}

Checking a URL in an if/else statement?

I'm trying to check a submitted URL (excluding any additional paths).
The user submitted URL is:
var inputUrl = document.getElementById("inputVal").value;
If the user submits 'http://stackoverflow.com/questions/ask' then I'm trying to create an if/else statement that will determine whether the site is 'stackoverflow.com', regardless of 'http/https' or any '/.../.../' after .com
if (inputUrl == "stackoverflow.com") {
console.log ("stackoverflow");
} else {
console.log("not stackoverflow");
}
Any help would be greatly appreciated.

if(inputUrl.toLowerCase().indexOf("stackoverflow.com") > -1) {
...
}

A little trick to have the browser do most stuff for you (can be found at MDN):
var url = document.createElement('a');
url.href = 'http://stackoverflow.com/questions/ask';
console.log(url.host); // stackoverflow.com
if (url.host == "stackoverflow.com") {
console.log ("stackoverflow");
} else {
console.log("not stackoverflow");
}
The same way you can also access other parts of the URL like protocol or hash.

$("button").on("click",function(){
var inputUrl = document.getElementById("inputVal").value;
inputUrl=inputUrl.split("http://")[1] || inputUrl.split("https://")[1] ;
inputUrl=inputUrl.split("/")[0];
if (inputUrl == "stackoverflow.com") {
console.log ("stackoverflow");
} else {
console.log("not stackoverflow");
}
}) ;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input id="inputVal" value="http://stackoverflow.com/questions/ask">
<button>
submit
</button>
jsfiddle Demo : https://jsfiddle.net/geogeorge/h40dvbq6/2/

Input file validation with knockout JS and file API

I am new to knockout js and trying to write custom validation for file input from client side using knockout JS and file API. The main aim is to validate the file extension and file size, and clear the file input path should validation error occur.
Below is the code being done using pure javascript. Appreciate if someone could lend a hand.
function FileAPIViewModel() {
var self = this;
}
ko.applyBindings(new FileAPIViewModel());
$('#i_file').change( function() {
//check whether browser fully supports all File API
if (window.File && window.FileReader && window.FileList && window.Blob)
{
//get the file size and file type from file input field
var fsize = $('#i_file')[0].files[0].size;
var ftype = $('#i_file')[0].files[0].type;
if(fsize>10)
{
alert(fsize +" bites\nToo big!");
$('#i_file').val('');
}
switch(ftype)
{
case 'image/png':
case 'image/gif':
break;
default:
alert('Unsupported File!');
$('#i_file').val('');
}
}else{
alert("Please upgrade your browser, because your current browser lacks some new features we need!");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout-validation/2.0.3/knockout.validation.min.js"></script>
<input type="file" input="" id="i_file" />
<input type="button" value="Submit" id="i_submit" />

You could try making a custom jquery validator for this.
$.validator.addMethod("filesize", function (value, element, params) {
//20000000
var ext = value.substr(value.length - 4);
//If there is no file
if (value === "") {
return false;
}
//check extension
if (ext !== null) {
if (ext !== ".pdf") {
return false;
}
}
//check file size
if(element.files[0] != null){
if (element.files[0].size > 20000000) {
return false;
}
}
return true;
}, 'Must Upload A Valid PDF Under 20MB');
Then add rule to your input(s) which I believe is i_file
$('[id^="i_file"]').each(function () {
$(this).rules('add', {
filesize: true
});
});

Reset fileupload control from javascript

I have a ASP website page where i have a upload control added
<asp:FileUpload ID="FileUpload1" runat="server"
BorderStyle="None" Width="215px" onchange="return checkfile();" style="margin-left: 14px" BackColor="#F0F0F0" />
From javascript i am validating the file which will be uploaded. If it is of type .exe then I will not allow to upload and give a message. if not i will display the file name in label "lblFileName" . But the problem if error(in case file is exe) then i want to reset the upload control(FileUpload1) . Now it will show only message but allows form to submit along with the .exe file.So how I can reset it?
function checkfile() {
var filename = document.getElementById("FileUpload1").value;
var lastIndex = filename.lastIndexOf("\\");
if (lastIndex >= 0) {
filename = filename.substring(lastIndex + 1);
}
var FileExt = filename.split('.').pop();
if (FileExt == "exe") {
document.getElementById('<%=lblFileName.ClientID%>').innerHTML = "you cannot attach exe file";
return false;
}
else {
document.getElementById('<%=lblFileName.ClientID%>').innerHTML = filename;
}
}

Your code is the problem onchange="return checkfile();"
And your function should look like
function checkfile() {
var filename = document.getElementById("FileUpload1").value;
var lastIndex = filename.lastIndexOf("\\");
if (lastIndex >= 0) {
filename = filename.substring(lastIndex + 1);
}
var FileExt = filename.split('.').pop();
if (FileExt == "exe") {
document.getElementById('lblFileName').innerHTML = "you cannot attach exe file";
document.getElementById("FileUpload1").value='';
return false;
}
else {
document.getElementById('lblFileName').innerHTML = filename;
}
}
Return will disallow file to put in your file upload control so this will solve your problem
Please check demo here

I am doing it this way using jquery:
$(function () {
$('<%= fileUploadCV.ClientID %>').change(function () {
//because this is single file upload I use only first index
var f = this.files[0]
//here I check if the file size is bigger than 8 MB (numbers below are in bytes)
if (f.size > 8388608 || f.fileSize > 8388608)
{
//show an alert to the user
alert("Allowed file size exceeded. (Max. 8 MB)")
//and RESET file upload control
this.value = null;
}
})
});

Check for Valid Email with jQuery

I am trying to use jQuery to see if a user has entered a valid email address into my text box.
Basically, I want the submit button to remain disabled by default, but on each keyup I want to see if the email address is valid, then I want to enable the button. If the user enters a valid email but then deletes parts so that it becomes invalid again (i.e. the # symbol) I want the submit button to become disabled again.
I have a partially working script here. My check or the # symbol works well, but I am having a hard time checking for .com, .co, .net, .org, .edu etc... For some reason, the button keeps enabling even though I have not entered a valid "ending" to the email.
For example "emailco#" is recognized as a valid email. Here is my script:
<script>
$(document).ready(function() {
$('#email').bind('keyup', function(e) {
var email = document.getElementById("email");
if (email.value.search("#") != -1) {
if (
(email.value.search(".com") != -1)||
(email.value.search(".co") != -1)||
(email.value.search(".org") != -1)||
(email.value.search(".net") != -1)||
(email.value.search(".gov") != -1)||
(email.value.search(".biz") != -1)||
(email.value.search(".me") != -1)||
(email.value.search(".edu") != -1)) {
document.getElementById("email_go").disabled = false;
}
else {
document.getElementById("email_go").disabled = true;
}
}
else {
document.getElementById("email_go").disabled = true;
}
});
});
</script>

Just use regex:
if (email.value.search("#") != -1) {
if (/(.+)#(.+)\.(com|edu|org|etc)$/.test(email.value))
}

var email = $('#email').val();
var pattern = ".+\\##.+\\..+";
var valid = email.match(pattern);
if (valid == null) {
alert("Not Valid");
return;
}
else{
alert("Valid");
return;
}

Try this. Of course, this is just a basic example and I'm sure that email addresses nowadays can end in more than just what's specified in the array below. But, still... you get the idea...
// Split the email to see if there's an "#" character
var split = email.split('#');
var split_count = split.length;
// If there is, then split the second string by a "."
if (split_count == 2) {
var domain = split[1].split('.');
var domain_count = domain.length;
if (domain_count == 2) {
// Store all of the accepted values for email endings
var endings = ['org', 'com', 'net', 'edu', 'info', 'biz', 'me'];
var result = $.inArray(domain[1], endings);
// If the final 3 chars of the string are in the array, then proceed
if (result > 0) {
}
}
}

I use this Regex Code to test email format using jQuery:
var email = $('.email').val();
if(email.match(/^\w+#[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/))
{
alert('OK');
}