刷新页面后保持输入值

Keep input value after refresh page

本文关键字:输入 刷新      更新时间:2023-09-26

我有一个输入字段的表单,这个输入包含一个下拉菜单从数据库读取信息。如果用户输入值,当他到达下拉菜单时,他没有找到他想要的东西,他会转到另一个页面将该信息添加到下拉菜单中,然后转到第一页继续输入信息。如果他去另一个页面添加信息到下拉菜单,我怎么能保持这个信息,以及如何添加信息到下拉菜单后找到这个信息没有刷新和没有提交。

这是格式为

的第一页
<form name='' method='post' action='<?php $_PHP_SELF ?>'>
<input name='txt_name' id='' type='text'>

这个下拉菜单从数据库

读取
 <select id="groups" name="txt_label" class="form-control">
   ';?>
     <?php 
    $sql=mysqli_query($conn,"select DISTINCT db_label from tbl_label")or die(mysqli_error($conn));
 echo'<option  value="">-- Select --</option>';
    while($row=mysqli_fetch_array($sql)){
        $label=$row['db_label'];
        echo "<option value='$label'>$label</option>"; 
    }echo'</select>';?><?php echo'
  </div>
</form>

另一页的第二个表单

<form class="form-inline" role="form" name="form" method="post" action="';?><?php $_PHP_SELF ?><?php echo'">
    <div class="form-group">
    <label for="pwd">Label</label>
  <input id="txt_label" name="txt_label" type="text" placeholder="Label" class="form-control input-md">
  </div>
   <div class="form-group">
    <label for="pwd">Sub Label</label>
  <input id="txt_sublabel" name="txt_sublabel" type="text" placeholder="SubLabel" class="form-control input-md">
  </div>
   <input type="submit" name="addlabel" value="Add" class="btn btn-default">';

EDIT: Keep value of more input

HTML:

<input type="text" id="txt_1" onkeyup='saveValue(this);'/> 
<input type="text" id="txt_2" onkeyup='saveValue(this);'/> 
Javascript:

<script type="text/javascript">
        document.getElementById("txt_1").value = getSavedValue("txt_1");    // set the value to this input
        document.getElementById("txt_2").value = getSavedValue("txt_2");   // set the value to this input
        /* Here you can add more inputs to set value. if it's saved */
        //Save the value function - save it to localStorage as (ID, VALUE)
        function saveValue(e){
            var id = e.id;  // get the sender's id to save it . 
            var val = e.value; // get the value. 
            localStorage.setItem(id, val);// Every time user writing something, the localStorage's value will override . 
        }
        //get the saved value function - return the value of "v" from localStorage. 
        function getSavedValue  (v){
            if (!localStorage.getItem(v)) {
                return "";// You can change this to your defualt value. 
            }
            return localStorage.getItem(v);
        }
</script>

如果上面的代码不起作用,试试这个:

<input type="text" id="txt_1" onchange='saveValue(this);'/> 
<input type="text" id="txt_2" onchange='saveValue(this);'/>

如果你正在使用钩子,你也可以使用react context()中的useContext()

首先,您应该在模型类中添加一个变量文本框:

MVCStepByStep

名称空间。模型{公共类CustomerClass{公共字符串CustomerName {get;设置;}
}}

Then in Views——>索引。cshtml文件确保文本框是这样创建的: @Html。TextBoxFor (m =比;m.CustomerName)

一个完整的例子,请查看这个网站:

如何通过点击按钮使用JQuery更新c# MVC文本框- c# MVC一步一步[^]