带有两个按钮的输入字段

Input field with two buttons

本文关键字:按钮 输入 字段 两个      更新时间:2023-09-26

我有一个表单,有一个输入字段,但有两个按钮。这个想法是用代码签入或签出。该过程进入 php 文件,其中仅以空白页结束。怎么了?

编辑我将"btn_in"更改为"inputAnst_nr"现在它可以重新注册。但是,我如何获取按钮被按下?

.HTML

<form class="form-inline well" id="usr_stamp" name="usr_stamp" method="post" action="php/usr_time_reg.php">
  <div class="control-group">
    <input id="inputAnst_nr" name="inputAnst_nr" class="form-control input-lg" placeholder="Ange Anst. nr" type="tel">
      <button id="btn_in" name="btn_in" class="btn btn-lg btn-info primary col-sm-offset-1" type="submit">In</button>
      <button id="btn_out" name="btn_out" class="btn btn-lg btn-danger primary col-sm-offset-1" type="submit">Ut</button>
  </div>
</form>

.JS

$(document).ready( function () {
  $("#btn_in").on('click', function() {
    $("#usr_stamp").attr("action", "php/usr_time_reg.php");
  });
  $("#btn_out").on('click', function() {
    $("#usr_stamp").attr("action", "php/usr_time_reg.php");
  });
});

.PHP

//Check if POST is empty
if(!empty($_POST)){
    //Check if POST is "inputAnst_nr"
    if(!empty($_POST['inputAnst_nr'])){
        //Put POST_btn_in in variable
        $posted_anst_nr = $_POST['inputAnst_nr'];

您可以只对两个按钮使用相同的名称属性值,只需确保指定适当的值即可。例:

<?php
if(isset($_POST['btn_in_out'])) {
    $status = $_POST['btn_in_out']; // In or Out depending on which one you clicked
    echo $status;
}
?>
<form class="form-inline well" id="usr_stamp" name="usr_stamp" method="post">
    <div class="control-group">
    <input id="inputAnst_nr" name="inputAnst_nr" class="form-control input-lg" placeholder="Ange Anst. nr" type="tel">
        <button id="btn_in" name="btn_in_out" type="submit" value="In">In</button>
        <button id="btn_out" name="btn_in_out" type="submit" value="Out">Ut</button>
    </div>
</form>

示例输出