如何检测PHP中通过POST发送的提交按钮

时间:2012-06-02 18:50:18

标签: php jquery forms post submit

问题:

使用jQuery检测在通过PHP发送表单后按下了哪个提交按钮。

情境:

我有三个按钮:

  1. submit-update1
  2. 提交-UPDATE2
  3. 提交-UPDATE3
  4. 如果在PHP中设置了$ _POST ['submit-update1'],那么jQuery应该将一个类添加到id为“collapseOne”的div中。例如:

    if (PHP POST submit button 1 is submitted)
    {
        $('#collapseOne').addClass('in');
    }
    
    if (PHP POST submit button 2 is submitted)
    {
        $('#collapseTwo').addClass('in');
    }
    
    if (PHP POST submit button 3 is submitted)
    {
        $('#collapseThree').addClass('in');
    }
    

    DIV元素:

    <div class="accordion" id="accordion2">
        <div class="accordion-group">
          <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
              Title 1
            </a>
          </div>
          <div id="collapseOne" class="accordion-body collapse">
            <div class="accordion-inner">
                Text here
            </div>
          </div>
        </div>
        <div class="accordion-group">
          <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
              Title 2
            </a>
          </div>
          <div id="collapseTwo" class="accordion-body collapse">
            <div class="accordion-inner">
              Text here
            </div>
          </div>
        </div>
        <div class="accordion-group">
          <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
              Title 3
            </a>
          </div>
          <div id="collapseThree" class="accordion-body collapse">
            <div class="accordion-inner">
              Text here
            </div>
          </div>
        </div>
    </div>
    

    提交按钮:

    <button type="submit" id="submit-update1" name="submit-update1">Update 1</button>
    <button type="submit" id="submit-update2" name="submit-update2">Update 2</button>
    <button type="submit" id="submit-update3" name="submit-update3">Update 3</button>
    

    欢迎任何建议,并提前致谢!

3 个答案:

答案 0 :(得分:2)

  <form method="post" id="many_buttons">
    <input type="hidden" id="submit_button" name="button_pressed" />

    <button type="submit" id="submit-update1" name="submit-update1">Update 1</button>
    <button type="submit" id="submit-update2" name="submit-update2">Update 2</button>
    <button type="submit" id="submit-update3" name="submit-update3">Update 3</button>
  </form>

  <script>
  $('#many_buttons button[type=submit]').click(function(){
    $('#submit_button').val($(this).attr('name'))
  })
  </script>

然后在服务器端:

  <?php
  if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    $button = $_POST['button_pressed'];

    if ($button == 'submit-update1')
      $div = 'collapseOne';
    elseif ($button == 'submit-update2')
      $div = 'collapseTwo';
    elseif ($button == 'submit-update3')
      $div = 'collapseThree';
  }
  ?>

最后你打印这个javascript:

  <?php if (!empty($div)) : ?>
  <script>$('#<?php echo $div ?>').addClass('in')</script>
  <?php endif ?>

答案 1 :(得分:0)

我假设您已经找到了帖子提交按钮,但是根据这些变量操作页面时遇到了问题。您可以使用动态脚本根据post变量设置一些变量,如下所示:

echo "<script type='text/javascript'>";
if (isset($_POST['submit-update1']) && $_POST['submit-update1'] == true) {
    echo "var submitUpdate1 = true;";
}
else {
    echo "var submitUpdate1 = false;";
}
///...do similar things for the rest of your post variables
echo "</script>";

然后在您的javascript中,您只需在文档准备就绪后访问上面定义的那些变量。

答案 2 :(得分:0)

将此添加到您的html:

<input type="hidden" name="submit" value="" />

然后这是jQuery:

$('button[type="submit"]').on('click', function(e){
    $('form input[name="submit"]').val($(this).attr('name'));
    $('form').serialize();
});