要自动填充“编辑”按钮上文本框中的值，请单击并编辑/更新HTML表单中的值

编辑/更新显示的HTML表单详细信息。

view.php

我有一些输出/显示详细信息，例如-

  FirstName:  ABC  
  LastName:   PQR  
  Position:   Developer
  Gender:     Male 

这会在HTML引导程序中以正确的格式显示。

现在，我们要编辑/更新此详细信息，即单击按钮时，这些字段应转换为文本框，并自动填充这些相同的值，例如-

         ------
Gender:   Male   <-in the textbox on edit/update click button. [For all fields]
         ------

到目前为止，我们已经尝试过了

<div class="form-group">
    <div class="row">
        <div class="col-lg-2">
            <label for="Telephone Number">Firstname :</label>
        </div>
        <div class="col-lg-2 f1">
            <?php echo $FirstName; ?>
        </div>
        <div class="fnane">
            <input type="text" class="form-control" value="<?php echo $row['FirstName'];?>">
        </div>


    </div>
</div>

<div class="form-group">
    <div class="row">
        <div class="col-lg-2 f1">
            <label for="LastName">Lastname :</label>
        </div>
        <div class="col-lg-2">
            <?php echo $LastName; ?>                                    
        </div>
        <div class="lname">
            <input type="text" class="form-control" value="<?php echo $row['LastName'];?>">
            </div>
        </div>
    </div>
    <div class="btn-group">

    <input type="button" id="candi_v_btn" name="candi_v_btn" value="Edit" class="btn2 btn-primary show" style="margin-left:348px"> <!--onClick="document.location.href='addcandidate.php'"-->
    </div>

和Jquery为：

(function() {
$( document ).ready(function() {
$('.fname').eq(0).hide();
$('.lname').eq(0).hide();
$('.pos').eq(0).hide();
$('.gen').eq(0).hide();

});


$(".show").click(function () {
$('.f1').eq(0).hide();
$('.fname').eq(0).show();
$('.lname').eq(0).show();
$('.pos').eq(0).show();
$('.gen').eq(0).show();
});
  })();

从上面的代码中我们得到的是-在输出值的前面显示空白文本框。

我们得到的是