Question

我正在尝试将表单帖子提交到php页面（具有虚拟变量），然后返回结果并将其显示在同一页面上的“userinfo”div中。我怀疑我需要将信息发布到同一页面或使用Ajax但不确定如何实现这一点。

在网上拖网几个小时没有提供我正在尝试做的任何体面的例子。

任何帮助表示赞赏：

无论如何这里是代码：

        <form name="Find User" id="userform" class="invoform" method="post" action="includes/find.php" />
            <div id ="userdiv">
                <p>Name (Lastname, firstname):</p></label><input type="text" name="username" id="username" class="inputfield" />
                <input type="submit" name="find" id="find" class="passwordsubmit" value="find" />
            </div>
        </form>
        <div id="userinfo"><b>info will be listed here.</b></div>

php dummy vars：

<?php

$user=$_POST['username'];
$username="username";
$gg_groups="gg_usergroups";
$enabled="True";

$result = array(
    'username' => $username,
    'user' => $user,
    'usergroups' => $gg_groups,
    'enabled'=> $enabled
);

echo json_encode($result);

?>

Answer 1

我不确定你想要做什么？将表单提交到同一页面很简单，只需将action属性保留为空白，如下所示：

<form name="Find User" id="userform" class="invoform" method="post" action="">

然后将其添加到php，以检查表单是否已发送：

if(isset($_POST['find'])){
    //Do whatever you want with the form here
}

评论后编辑：好吧很难给你一个没有所有代码的确切代码，但坚持只是php，为什么不将表单发送到你想要显示的页面，包括处理结果的php文件然后写一个echo语句到输出结果？像这样的东西：

    <form name="Find User" id="userform" class="invoform" method="post" action="">
        <div id ="userdiv">
            <p>Name (Lastname, firstname):</p></label><input type="text" name="username" id="username" class="inputfield" />
            <input type="submit" name="find" id="find" class="passwordsubmit" value="find" />
        </div>
    </form>
    <div id="userinfo">
    <?php
    if(isset($_POST['find'])){
        include('dummyvars.php');
        echo"Username = ". $username . "<br> User = ". $user ."<br> Usergroups = ". $gg_groups ."<br> Enabled = ". $enabled;
    }
    ?>
    </div>

Answer 2

我建议使用jQuery.ajax()：

$.ajax({
    type: "POST",
    dataType: "json",
    url: "some.php",
    data: {$("#username").val();}
    success: function(data) {
        $("#userval").text(data.username);
    }
});

Answer 3

您可以使用jquery库和此javascript代码。

$(document).ready(function(){
    $('#find').click(function(){
        var form = $(this).closest('form');

        $.post(form.attr('action'), form.serialize(), function (data){
            var c;
            $.each(data, function(i, e){
                c += i + ':' + e;
            });
            $('#userinfo').html(c);
        }, 'json');
    });
});

Answer 4

使用Jquery和绑定事件来提交操作。

 $(function (){

 $("#userform").submit(function (){
  $.ajax({
    type: "POST",
    dataType: "json",
    url: "some.php",
    data: {username : $("#username").val()}
    success: function(data) {
       $("#userinfo b").html(data.username);
    }
  });

  });
 });

Answer 5

<script type="text/javascript">

$(document).ready(function(){

$("#find").click(function(){
    var username  = $("#username").val();
        $.ajax({
        type: 'POST',
        dataType: 'json',
        url: 'includes/find.php',
        data: 'username='+username,
        success: function( data ) {
        //in data you result will be available...show here

        },

error: function(xhr, status, error) {
    alert(status);
    },
dataType: 'text'

});
    });

});



</script>

<form name="Find User" id="userform" class="invoform" method="post" />

<div id ="userdiv">
  <p>Name (Lastname, firstname):</p>
  </label>
  <input type="text" name="username" id="username" class="inputfield" />
  <input type="button" name="find" id="find" class="passwordsubmit" value="find" />
</div>
</form>
<div id="userinfo"><b>info will be listed here.</b></div>

将表单变量发布到php返回结果并放在div中

5 个答案: