提交模型表单想在php变量中发布值

时间:2014-01-01 08:28:25

标签: php jquery

感谢大家对我上一个问题的大力帮助。

现在我又遇到了问题。

问题:我正在使用模型表单提交密码。在提交模型表单时,我想将操作称为$ _POST或$ _REQUEST。但我无法在PHP代码中获得发布操作。下面是我的代码

文件名:password.php

          <?php
            // i try both method
            if($_SERVER['REQUEST_METHOD'] == 'POST')
            {
            var_dump($_REQUEST['data']); die;
            }

            /*if($_REQUEST['data'])
            {
                $password=$_REQUEST['data'];   

                var_dump($password);
             die;
            }*/
            ?>
            <!doctype html>
            <html lang="en">
            <head>
            <meta charset="utf-8">
            <title>Reset Password</title>
            <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
            <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
            <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
            <style>
            body { font-size: 62.5%; }
            label, input { display:block; }
            input.text { margin-bottom:12px; width:95%; padding: .4em; }
            fieldset { padding:0; border:0; margin-top:25px; }
            h1 { font-size: 1.2em; margin: .6em 0; }
            div#users-contain { width: 350px; margin: 20px 0; }
            div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
            div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
            .ui-dialog .ui-state-error { padding: .3em; }
            .validateTips { border: 1px solid transparent; padding: 0.001em; }
            .ui-dialog-titlebar-close {display:none !important;}
            </style>
            <script>
            $(function() 
            {
                var password = $( "#password" ), RePassword = $( "#RePassword" ), allFields = $( [] ).add(password).add(RePassword ),tips = $( ".validateTips" );
                function updateTips( t ) 
                {
                    tips.text( t ).addClass( "ui-state-highlight" );
                    setTimeout(function() 
                    {
                        tips.removeClass( "ui-state-highlight", 1500 );
                    }, 500 );
                }
                function checkLength( o, n, min, max ) 
                {
                    var pass=password.val();
                    var repass=RePassword.val();
                    if ( o.val().length > max || o.val().length < min ) 
                    {
                        o.addClass( "ui-state-error" );
                        updateTips( "Length of " + n + " must be between " + min + " and " + max + "." );
                        return false;
                    }
                    else if(pass != repass)
                    {
                        o.addClass( "ui-state-error" );
                        updateTips( "password not match." );
                        return false;
                    }
                    else 
                    {
                        return true;
                    }
                }
                function checkRegexp( o, regexp, n ) 
                {
                    if ( !( regexp.test( o.val() ) ) ) 
                    {
                        o.addClass( "ui-state-error" );
                        updateTips( n );
                        return false;
                    } 
                    else 
                    {
                        return true;
                    }
                }
                $( "#dialog-form" ).dialog(
                {
                    closeOnEscape: false,
                    autoOpen: true,
                    height: 250,
                    width: 300,
                    modal: true,
                    buttons: {
                        "submit": function(e) {
                            var bValid = true;
                            allFields.removeClass( "ui-state-error" );
                            bValid = bValid && checkLength( password, "password", 8, 16 );
                            bValid = bValid && checkLength( RePassword, "RePassword", 8, 16 );

                            if ( bValid ) {
                            e.preventDefault();
                                $.ajax({
                                    type: "POST",
                                    url : 'adq.php',
                                    data: {password: RePassword.val()},                                     
                                    success: function(e)
                                    {
                                        console.log("successfull");
                                    }
                                });         
                                $( this ).dialog( "close" );
                            }
                        },
                    },
                    close: function() 
                    {
                        allFields.val( "" ).removeClass( "ui-state-error" );
                    }
                });
            });
            </script>
            </head>
            <body>
                <div id="dialog-form" title="Create new password">
                    <p class="validateTips"></p>
                    <form>
                        <fieldset>
                            <label for="password">Password</label>
                            <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all">
                            <label for="RePassword">Re-Password</label>
                            <input type="password" name="RePassword" id="RePassword" class="text ui-widget-content ui-corner-all">
                        </fieldset>
                    </form>
                </div>
            </body>
            </html>

了解更多详情。

1 个答案:

答案 0 :(得分:0)

使用ajax时,您似乎忘了将收到的响应添加到网页中。表单已提交,但您没有看到网页中的更改,因为您实际上没有指定应对数据执行的操作。您可以使用$(#elementID).html(html_)为收到的数据设置元素的内部HTML,假设elementID是您要放置数据的元素ID,而html_是收到的数据来自ajax。

示例

假设存在名称 adq.php 的文件,以下内容应该有效,ID dialog-form的元素是您要将其内部HTML更改为从ajax和您要提交的数据是RePassword.val()

$.ajax({
    type: "POST",
    url : 'adq.php',
    data: {password: RePassword.val()},                                     
    success: function(e)
    {
       $("#dialog-form").html(e); 
       // console.log("successfull");
    }
}); 

PHP文件的完整内容

<?php

if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
    var_dump($_REQUEST['password']);
}

/*if($_REQUEST['data'])
{
    $password=$_REQUEST['data'];   

    var_dump($password);
 die;
}*/
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Reset Password</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<style>
body { font-size: 62.5%; }
label, input { display:block; }
input.text { margin-bottom:12px; width:95%; padding: .4em; }
fieldset { padding:0; border:0; margin-top:25px; }
h1 { font-size: 1.2em; margin: .6em 0; }
div#users-contain { width: 350px; margin: 20px 0; }
div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
.ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.001em; }
.ui-dialog-titlebar-close {display:none !important;}
</style>
<script>
$(function() 
{
    var password = $( "#password" ), RePassword = $( "#RePassword" ), allFields = $( [] ).add(password).add(RePassword ),tips = $( ".validateTips" );
    function updateTips( t ) 
    {
        tips.text( t ).addClass( "ui-state-highlight" );
        setTimeout(function() 
        {
            tips.removeClass( "ui-state-highlight", 1500 );
        }, 500 );
    }
    function checkLength( o, n, min, max ) 
    {
        var pass=password.val();
        var repass=RePassword.val();
        if ( o.val().length > max || o.val().length < min ) 
        {
            o.addClass( "ui-state-error" );
            updateTips( "Length of " + n + " must be between " + min + " and " + max + "." );
            return false;
        }
        else if(pass != repass)
        {
            o.addClass( "ui-state-error" );
            updateTips( "password not match." );
            return false;
        }
        else 
        {
            return true;
        }
    }
    function checkRegexp( o, regexp, n ) 
    {
        if ( !( regexp.test( o.val() ) ) ) 
        {
            o.addClass( "ui-state-error" );
            updateTips( n );
            return false;
        } 
        else 
        {
            return true;
        }
    }
    $( "#dialog-form" ).dialog(
    {
        closeOnEscape: false,
        autoOpen: true,
        height: 250,
        width: 300,
        modal: true,
        buttons: {
            "submit": function(e) {
                var bValid = true;
                allFields.removeClass( "ui-state-error" );
                bValid = bValid && checkLength( password, "password", 8, 16 );
                bValid = bValid && checkLength( RePassword, "RePassword", 8, 16 );

                if ( bValid ) {

                e.preventDefault();
                    $.ajax({
                        type: "POST",
                        url : 'adq.php',
                        data: {password: RePassword.val()},                                     
                        success: function(e)
                        {
                           $("#dialog-form").html(e); 
                           // console.log("successfull");
                        }
                    });         
                    $( this ).dialog( "close" );
                }
            },
        },
        close: function() 
        {
            allFields.val( "" ).removeClass( "ui-state-error" );
        }
    });
});
</script>
</head>
<body>
    <div id="dialog-form" title="Create new password">
        <p class="validateTips"></p>
        <form>
            <fieldset>
                <label for="password">Password</label>
                <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all">
                <label for="RePassword">Re-Password</label>
                <input type="password" name="RePassword" id="RePassword" class="text ui-widget-content ui-corner-all">
            </fieldset>
        </form>
    </div>
</body>
</html>    

注意您还应该使用PHP中的$_REQUEST['password']来获取提交的值,而不是$_REQUEST['data'],因为HTML中指示的字段名称为password而不是data Jon所述。