通过ajax将表单变量从load <div>传递到同一个<div>中？

I'm trying to pass the variables from the form which was loaded from jquery clicked. Into the same div. I tried test it but none of them works. Here's my script :

Javascript

//login
function login(){
    $('#prop_form').load('inc/prop_form_login.php');
    $('.axn_btn').hide();
}

$(document).ready(function(){
    $("form").on('click', '#submit', function(e){
       e.preventDefault();
       var jsURL = $(this).serialize()+"&lang=$_GET[lang]";
       submit(jsURL);
    });
});

function submit(jsURL){
    $.ajax({
        url:'login_chk.php',
            type :'POST',
            success: function(data){
                $('#prop_form').html(data);
            }
    });
}

HTML

<div id="prop_form">
<div class="axn_btn">
<a onClick="login()">login</a>
</div>
</div>

login_chk.php

<?
session_start();
error_reporting(E_ALL);
print_r($_POST[data]);exit();//for testing purpose
.
.
.
?>

I expect the login form data to display in the #prop_form. But the page refresh with return data from login_chk.php.

Finally, the script is working now. Thank you very much for @khairul.ikhwan and @Hakan Kose. You guys are great!

Here is the script:

//login 
function login(){ 
    $('#prop_form').load('inc/prop_form_login.php', function(){
        $("#login_form").on('click', '#submit', function(e){ 
            e.preventDefault(); 
            var jsURL = $('form').serialize()+"&lang=<?=$_GET[lang]?>"; 
            submit(jsURL); 
        });
    }); 
    $('.axn_btn').hide(); 
} 

function submit(jsURL){
    $.ajax({
        url:'login_chk.php',
            type :'POST',
            data: {data: jsURL},
            success: function(data){
                $('#prop_form').html(data);
            }
    });
}

I can't accept both of your codes in the same post. But please know that you guys are part of the solution.

You load the form on click but you are binding the onclick event to the submit button on document ready. The form is still not loaded yet. Perhaps you can try move belows code to the callback after you load the login form in the function login()

Edit : use belows code see if it work.

//login 
function login(){ 
    $('#prop_form').load('inc/prop_form_login.php', function(){
        $("form").on('click', '#submit', function(e){ 
            e.preventDefault(); 
            var jsURL = $(this).serialize()+"&lang=$_GET[lang]"; 
            submit(jsURL); 
        });
    }); 
    $('.axn_btn').hide(); 
} 

function submit(jsURL){ 
    $.ajax({ 
        url:'login_chk.php', 
        type :'POST', 
        success: function(data){ 
            $('#prop_form').html(data); 
        } 
    }); 
}

EDIT This must do the job;

function login(){
    $('#prop_form').load('inc/prop_form_login.php');
    $('.axn_btn').hide();
}

$(document).ready(function(){
    $("form").on('click', '#submit', function(e){
       e.preventDefault();
       var getLang = <?php echo "'" . $_GET['lang'] . "'"?>;
       var jsURL = $(this).serialize()+"&lang=" + getLang;
       submit(jsURL);
    });
});
function submit(jsURL){
    $.ajax({
        url:'login_chk.php',
            type :'POST',
            data: {data: jsURL},
            success: function(data){
                $('#prop_form').html(data);
            }
    });
}

Than for example in your login_chk.php

<?php 
    // This echo will be showed in you success function as data
    echo $_POST["data"];
?>