CODEWITHSUNDEEP
javascriptjqueryajax
Eduardo Go
Eduardo Go

Reputation: 401

JS: Insert JS into jQuery/AJAX code

I'd like to know how can I use my Javascript code in my jQuery-AJAX code:

JS Code

var error="";

function Checkfiles() {
    var fup = document.getElementById('flUpload');
    var fileName = fup.value;
    var ext = fileName.substring(fileName.lastIndexOf('.') + 1);
    var chkext = ext.toLowerCase();

    if(chkext=="gif" || chkext=="jpg" || chkext=="jpeg" || chkext=="png") { 
        return true;
    } else { return false; }
} // Checkfiles

function Checksize() { 
    var iSize;
    if ($("#flUpload")[0].files[0]){ iSize = ($("#flUpload")[0].files[0].size / 1024);}
    if(Checkfiles()==true && iSize < 51.200) { return true; } else { error += "- Only GIF, PNG, JPG images, smaller than 50 KB."; return false; }
} //Checksize

And this jQuery code:

$(document).ready(function() {

$("#ff1").submit(function(e){
    // prevent submit
    e.preventDefault();

    var email = document.getElementById("email").value;
    var title = document.getElementById("title").value;
    var url = document.getElementById("url").value; 
    var parametros = {"emaail":email, "tiitle":title, "uurl":url, "filee":file};

    $.ajax({
        data: parametros,
        url: 'validate.php',
        type: 'post',
        context: this,
        error: function (response) {
            alert("An error has occurred! Try Again!");
        },
        success: function (response) {
            if($.trim(response) == 'bien') { 
                this.submit(); // submit, bypassing jquery bound event
            } 
            else {
                $("#ajax_call_val").html('<div id="validation"><ul>'+response+'</ul></div>');
            }
        }
    });

});

});

I want to validate a file input with my Javascript code, if Checksize() returns true, in the AJAX code the following line should be:

$("#ajax_call_val").html('<div id="validation"><ul>'+response+'</ul></div>');

If Checksize() returns false, Should be:

$("#ajax_call_val").html('<div id="validation"><ul>'+response+'<li>Only GIF, PNG, JPG images, smaller than 50 KB</li></ul></div>');

Thanks in advance!

Upvotes: 0

Views: 291

Answers (1)

tymeJV
tymeJV

Reputation: 104785

In the success function do:

if (Checksize()) {
    $("#ajax_call_val").html('<div id="validation"><ul>'+response+'</ul></div>');
} else {
    $("#ajax_call_val").html('<div id="validation"><ul>'+response+'<li>Only GIF, PNG, JPG images, smaller than 50 KB</li></ul></div>');
}

Combine your above to codes:

var error="";

function Checkfiles() {
    var fup = document.getElementById('flUpload');
    var fileName = fup.value;
    var ext = fileName.substring(fileName.lastIndexOf('.') + 1);
    var chkext = ext.toLowerCase();

    if(chkext=="gif" || chkext=="jpg" || chkext=="jpeg" || chkext=="png") { 
        return true;
    } else { return false; }
} // Checkfiles

function Checksize() { 
    var iSize;
    if ($("#flUpload")[0].files[0]){ iSize = ($("#flUpload")[0].files[0].size / 1024);}
    if(Checkfiles()==true && iSize < 51.200) { return true; } else { error += "- Only GIF, PNG, JPG images, smaller than 50 KB."; return false; }
} //Checksize

$(document).ready(function() { //blah });

Upvotes: 1

Related Questions