Question

我有一个页面，显示有关＆＃34;容器＆＃34;中项目的一些信息，在该容器中有一些不同的字段以及两个访问不同页面的按钮。我有一个问题让按钮水平排列，我怎么能完成这个？我认为它与表单的呈现方式有关，是否有比表单更好的方法？你可以用css格式化表单吗

显示：内联

这是我第一次搞乱HTML，这是我的代码谢谢：

<div class="project-container">
    <label class="boldLabel">Project ID:</label>
    <span><?php echo $pId; ?></span><br>
    <label class="boldLabel">Project Owner:</label>
    <span><?php echo $pName; ?></span><br>
    <label class="boldLabel">Project Description:</label>
    <span><?php echo $pDesc; ?> </span><br><br>
    <label class="boldLabel">Project Due Date:</label>
    <span><?php echo $dDate; ?> </span><br>
        <form action="delete.php" method="GET">
            <input type="hidden" name="pId" value="<?php echo $pId; ?>">
            <button class="buttonDelete" type="submit" name="delete">Delete Project</button>
        </form>
        <form action="update.php" method="GET">
            <input type="hidden" name="pId" value="<?php echo $pId; ?>">
            <input type="hidden" name="pName" value="<?php echo $pName; ?>">
            <input type="hidden" name="pDesc" value="<?php echo $pDesc; ?>">
            <input type="hidden" name="dDate" value="<?php echo $dDate; ?>">
            <button class="buttonUpdate" type="submit" name="update">Update Project</button>
        </form>
    </div>
</div>

Answer 1

您的文件不需要任何2个表单。您只需要一个处理两个进程（删除和更新）的通用表单标记。这些过程可以通过Javascript函数和事件进行管理。

注意：关于2个按钮没有水平对齐的问题是因为您在不同的表单标签上有某些元素。您可以使用css做一些额外的工作，但开发人员通常会避免在一个文件中使用两个表单，除非这可能是某个进程的唯一方法。

我修复了代码。您可以在此处看到代码段：

function buttoncheck(action)
  {
  //$("project-container").load("process.php", {action: action});   
  // This is an example of how you could "call" process.php
  }

<form action="process.php" method="post">

<div id="project-container" class="project-container">
    <label class="boldLabel">Project ID:</label>
    <span><?php echo $pId; ?></span><br>
    <label class="boldLabel">Project Owner:</label>
    <span><?php echo $pName; ?></span><br>
    <label class="boldLabel">Project Description:</label>
    <span><?php echo $pDesc; ?> </span><br><br>
    <label class="boldLabel">Project Due Date:</label>
    <span><?php echo $dDate; ?> </span><br>
            <input type="hidden" name="pId" value="<?php echo $pId; ?>">
            <input type="hidden" name="pId" value="<?php echo $pId; ?>">
            <input type="hidden" name="pName" value="<?php echo $pName; ?>">
            <input type="hidden" name="pDesc" value="<?php echo $pDesc; ?>">
            <input type="hidden" name="dDate" value="<?php echo $dDate; ?>">

        <button class="buttonDelete" type="button" name="delete" onClick="buttoncheck(0)">Delete Project</button>
        <button class="buttonUpdate" type="button" name="update" onClick="buttoncheck(1)">Update Project</button>
        
             
    </div>
    </form>

在“process.php”文件中

<?php

$action=$_POST['action'];

// To Update

if($action=1){

// update code here

}

if($action=0){

// delete code here

}

您可以在此链接中查看如何刷新div内容，onclick功能，css管理：

Load jquery method

Load Jquery method 2

onclick function

button css design process

排队按钮html

1 个答案: