Question

我有一个简单的按钮，一旦触发事件就会隐藏

<?php
//Define attributes     
echo'<input  type="submit" id="toggler" name="add_friend"class=button    
value="Add '. $output1['username'].' As A Friend ?" onClick="action();"/>
</input>'; 
?>
 //Hide the button
<script>
var hidden = false;
function action() {

    if(!hidden) {
        document.getElementById('toggler').style.visibility = 'hidden';
    }
}

以上工作原理应该没有问题，但是当我添加表单以获取按钮method=POST时，该按钮不会隐藏，也不会将我的POST转到$_POST['add_friend']

echo ' <form  method="post" >

<input  type="submit" id=toggler name="add_friend" class="button"     

value="Add '. $output1['username'].' As A Friend ?" onClick="action();"/>
 </input>
 </form>';

如何更正，以便隐藏按钮，并将我的POST传递给我的isset代码。

if (isset ($_POST['add_friend'])){
   //rest of my code once the button is clicked and hidden

提前致谢。

Answer 1

除非您没有提供更多信息或复制/粘贴所有内容，否则您似乎有额外的引用：

echo ' <form  "method="post" >

Answer 2

这有几个问题。您在表单中的“方法”之前有一个额外的双引号，还应该将action="#"添加到<form>代码中。这告诉浏览器将表单的结果发送到当前页面。添加隐藏字段以发送数据也是一种很好的做法，而不是将其添加到提交按钮。试试这个，看它是否有效。

if (isset($_POST['add_friend'])) {
    var_dump($_POST['add_friend']);
}
echo '
<form method="post" action="#">
    <input type="hidden" name="add_friend" value="'.$output1['username'].'">
    <input type="submit" id="toggler" class="button" value="Add '. $output1['username'].' As A Friend ?" onClick="action();"/>       
</form>
';

请记住，这实际上会重新加载页面，所以如果你想发出异步请求（EG，发送一些请求而不再重新加载页面），你需要查看一个AJAX的解决方案。 / p>

Answer 3

在表单中包装输入将原生提交表单以及激活您的javascript。如果要使用ajax解决方案，请绑定到submit事件并阻止默认操作。（在这里使用jquery）：

$( "form" ).on( "submit", function( event ) {
   event.preventDefault();

   // serialize() will get the form data, which can be used in ajax call
   console.log( $( this ).serialize() );
});

Answer 4

你的JS很可能隐藏了这个元素。然后您的表单将被提交（POST），仅用于刷新页面并重新显示该按钮。

在我看来，你想要劫持表单提交并使用ajax处理请求。

以下示例代码显示了与Php表单处理类似的问题。你可以适应自己的喜好（我遗漏了所需的Javascript）：

<?php
$feedback = null;

$people = array(
    1 => 'Samuel',
    2 => 'Fred',
    3 => 'Roger',
    4 => 'Mavis'
);

$friends = array(3); // i.e. Roger

if($_SERVER['REQUEST_METHOD'] == 'POST') {
    $add_friend = isset($_POST['add_friend']) ? $_POST['add_friend'] : null;
    if(array_key_exists($add_friend, $people) && !in_array($add_friend, $friends)) {
        array_push($friends, $add_friend); // You probably want to save state here
        $feedback = 'Added ' . $people[$add_friend] . ' as friend.'; 
    }
}


?>
<?php echo isset($feedback) ? $feedback : ''; ?>
<form  method="post">
    <?php foreach ($people as $key => $person) { ?>
        <button name=
        "add_friend" onClick=
        "action();" value=
        "<?php echo $key ?>"
        <?php echo in_array($key, $friends) ? 'disabled' : '' ?>
        >
        Friend <?php echo $person ?>
    </button>
    <?php } ?>
</form>

复选框可能比这里的按钮更合适。

按钮表单POST不起作用

4 个答案: