Question

The alert() works fine, but return false does not stop the form being posted – any ideas?

<script type="text/javascript">
function form_val() {
    //Check date
    var email=document.getElementById('email').value;
    var passw=document.getElementById('password').value;
    if(email==''||email==null||passw==''||passw==null) {
        alert('Please fill in both fields.');
        return false;
    }  

}
</script>

<form action="userlogin.html" method="post" name="log_form" onsubmit="return form_val();">
    <div data-role="fieldcontain">
        <input type="email" name="email" id="email" value="" placeholder="Email Address" />
        <input type="password" name="password" id="password" value="" placeholder="Password" />
        <div class="ui-grid-a">
        <div class="ui-block-a">
            <button type="submit" name="login" value="" data-theme="c">Sign In</button>
        </div>
        <div class="ui-block-b">
            <br />
            <a href="http://mobile.*****.com/lostpswd.html" rel="external" style="font-size:10px; padding-left:10px;">Forgotten Password?</a>
        </div>
    </div>
</form>

Answer 1

You’ve tagged your question jquery-mobile but you’re not using jQuery anywhere in the quoted code.

The code looks right in an old-fashioned DOM0 sort of way (which is okay and should still work except for issues with getElementById on IE7 and earlier). I’d change the checks in form_val a bit:

function form_val(){
    //Check date
    var email=document.getElementById('email').value;
    var passw=document.getElementById('password').value;
    if(!email || !passw) {
        alert('Please fill in both fields.');
        return false;
    }  
}

…but the ones you had probably should have worked barring the IE issue listed above or other script errors on the page in code that isn’t shown.

Here’s how you’d use jQuery (which works around the IE bug for you automatically) for the above:

jQuery(function($) {
    $("form[name='log_form']").submit(form_val);
});
function form_val() {
    if (!$("#email").val() || !$("#password").val()) {
        alert('Please fill in both fields.');
        return false;
    }
}

…or if you don’t need form_val to be global (avoid global functions where possible, and it doesn’t need to be global just to validate this form):

jQuery(function($) {
    $("form[name='log_form']").submit(form_val);
    function form_val() {
        if (!$("#email").val() || !$("#password").val()) {
            alert('Please fill in both fields.');
            return false;
        }
    }
});