Display a php function in jquery onblur

Question

I have html code:

<input type="text" id="email" onblur="<?php validate_email_input($email); ?>" />

And now I want to display while onblur:

function validate_email_input($email)
{
    if(!prawidlowy_email($email)) {
        throw new exception('<div id="#okno_bledu_rejestracji" style="background: #FBE3E4 url('.$errw.') no-repeat;background-position: 7px 7px;color:#E64D19;"><p>Kombinacja znaków w polu e-mail jest niepoprawna!</p></div>');
    }
    elseif(strlen($email) > 44) {
        throw new exception('<div id="#okno_bledu_rejestracji" style="background: #FBE3E4 url('.$errw.') no-repeat;background-position: 7px 7px;color:#E64D19;"><p>Pole email musi zawierać maksymalnie 44 znaki!</p></div>');
    }
    elseif(strlen($email) < 6) {
        throw new exception('<div id="#okno_bledu_rejestracji" style="background: #FBE3E4 url('.$errw.') no-repeat;background-position: 7px 7px;color:#E64D19;"><p>Pole email musi zawierać minimum 6 znaków!</p></div>');
    }
}

And for displaying it on the same page, but in div named okno_bledu_rejestracji I use this HTML code:

<div id="okno_bledu_rejestracji">validate error box</div>

And this JQ code, which is displaying after click form's submit button, which its name is #zarejestruj_sie:

$(document).ready( function() {
    $("#zarejestruj_sie").click( function() {

            $.post( $("#formularz_rejestracji").attr("action"), $("#formularz_rejestracji :input").serializeArray(), function(info) {
                $("#okno_bledu_rejestracji").empty();
                $("#okno_bledu_rejestracji").html(info);
            });

            $("#formularz_rejestracji").submit( function() {
                return false;
            });         
    });
});

Now I want to display a php function:

function validate_email_input($email)
    {
        if(!prawidlowy_email($email)) {
            throw new exception('<div id="#okno_bledu_rejestracji" style="background: #FBE3E4 url('.$errw.') no-repeat;background-position: 7px 7px;color:#E64D19;"><p>Kombinacja znaków w polu e-mail jest niepoprawna!</p></div>');
        }
        elseif(strlen($email) > 44) {
            throw new exception('<div id="#okno_bledu_rejestracji" style="background: #FBE3E4 url('.$errw.') no-repeat;background-position: 7px 7px;color:#E64D19;"><p>Pole email musi zawierać maksymalnie 44 znaki!</p></div>');
        }
        elseif(strlen($email) < 6) {
            throw new exception('<div id="#okno_bledu_rejestracji" style="background: #FBE3E4 url('.$errw.') no-repeat;background-position: 7px 7px;color:#E64D19;"><p>Pole email musi zawierać minimum 6 znaków!</p></div>');
        }
    }

In div named okno_bledu_rejestracji after onblur input, which id is email.

I give thumbs for help. thanks.

See also: [Why does the PHP (or other server side) code in my Javascript not work?](http://stackoverflow.com/q/13840429/1935077) — Petr R., Mar 22 '14 at 20:52

score 2 · Accepted Answer · answered Mar 22 '14 at 20:48

This isn't "normally" possible. PHP is executed by the server before the page is served to the client. The client doesn't understand your PHP code.

That being said, there is a way to achieve this with PHP. Using Ajax, it's possible to query the server with the email and get a response back from the server. Typically you'll get a response back in JSON.

With jQuery, the following code would do just that:

$(document).ready( function() {
    $("#email").mouseup(function() {
        var email = $(this).val(),
            url = "api/myfunction?email=" + email;

        $.get(url, function(data) {
            // We succeeded!  data contains your response.
        });
    });
});

score 1 · Answer 2 · answered Mar 22 '14 at 20:41

You will need to learn about Client-Side and Server-side. The distinction between these two will be really important in your web programming.

I recommend you learn a bit about Ajax. On the server-side you want a file, like ajax.php, that will take a email as GET parameter and will return a JSON with the response. On mouse up, jquery will call that ajax page and take his answer and put it in a DOM element, lets say a Div.

http://learn.jquery.com/ajax/

Good luck!

Also: If you are checking for email length and format, you might look forward a javascript translation of your code.

Yes, I am checking it now. Thanks You so much. But I hope somebody is going to give me an answer on a plate too. If something... Thanks again :) — waqmaz, Mar 22 '14 at 20:45

Display a php function in jquery onblur

2 Answers2