js validate 2 scripts together

I have 2 separate jquery scripts on one page to submit topics to the database.

One script is for sending the topic title and the category it belongs to. The second script is for uploading an image. I managed to send data from both via 1 button but validation isn't mutual.

For example, if I fill in all the text inputs but don't upload an image, I will get alerts from the text input script and the upload image script and if I upload just an image but leave the other inputs empty, the image still gets uploaded. I need to validate them together.

First is the script for the text inputs

<script type="text/javascript">
//save new topic
$('#save_topic').click(function() 
{
var topic_name = $('#topic_name').val();
var cat = $('#cat').val(); //category
var topic_img = $('#fileToUpload').val(); //upload input

//validate
if (topic_name == "")
    {
        window.alert("Add topic!");
        return false; //return false in function to cancel the request
    }     
if (cat == "")
    {
        window.alert("Choose category!");
        return false; 
    }   
if (topic_img == "")
{
    window.alert("Upload Image!");
    return false; 
}       

var dataString = 'topic_img='+ topic_img + '&topic_name='+ topic_name + '&cat=' + cat;
$.ajax({
type: "POST",
url: "save.php",
data: dataString,
cache: false,
success: function(html)
{
// reload page
}
});//end ajax   
})//end click

});//end jquery
</script>

and the image upload

<script type="text/javascript">
//upload image and genereate thumbs     
function ajaxFileUpload()
{
    $("#loading")
    .ajaxStart(function(){
        $(this).show();
    })
    .ajaxComplete(function(){
        $(this).hide();
    });

    $.ajaxFileUpload
    (
        {
            url:'image_upload.php',
            secureuri:false,
            fileElementId:'fileToUpload',
            dataType: 'json',
            success: function (data, status)
            {
                if(typeof(data.error) != 'undefined')
                {
                    if(data.error != '')
                    {
                        alert(data.error);
                    }else
                    {
                        alert(data.msg);
                        $('.mm-item').css("display", "none");
                    }
                }
            },
            error: function (data, status, e)
            {
                alert(e);
            }
        }
    )

    return false;

}
</script>

and the button that calls both scripts

<a href="#" id="save_topic" onClick="return ajaxFileUpload();">Save</a>

What method can I use to combine the two?

ansaurus

tags:

views:

answers:

js validate 2 scripts together

related questions