You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

前端用户表性别字段不显示,Postman请求正常网页提交失效求助

问题现象

我创建了用户表,所有功能运行正常,仅性别字段无法正常填充:通过Postman发起POST请求时,性别可以按预期显示,但通过网站前端创建用户后,表格中仅展示邮箱、姓名、激活/禁用状态,性别位置为空,我无法定位问题所在,相关代码如下:
问题截图

相关代码

update user.ejs

<!--include header-->
<%- include('include/_header')%>
<!--/include header-->


<!-- Main Site -->
<main id="site-main">
    <div class="container">
       <div class="box-nav d-flex justify-between">
        <div class="filter">
            <a href="/"><i class="fas fa-backward"></i>Visi Naudotjai</a>
        </div>
       </div>
       <div class="form-title text-center">
           <h2 class="text-dark">Atnaujinti Naudotoja</h2>
           <span class="text-light">Naudokitės apačioja pateikta forma atnaujinant naudotoja</span>
       </div>
       
       <!-- add user form -->
       <!-- form handling -->
<form  method="POST" id="update_user">
    <div class="new_user">
        <div class="form-group">
            <label for="name" class="text-light">Vardas</label>
            <input type="hidden" name="id" value="<%= user._id%>">             
                <input type="text" name="name" value="<%= user.name%>" placeholder="Vardenis">
      </div>
      <div class="form-group">
        <label for="email" class="text-light">Email</label>       
            <input type="text" name="email" value="<%= user.email%>" placeholder="pavizdys@gmail.com">
    </div>
    <div class="form-group">
    <label for="Lytis" class="text-light">Lytis</label>
    <div class="radio inline">
               <input type="radio" id="radio-2" name="Lytis" value="Vyras" <%= user.gender =='Vyras'? 'checked' :''%>>
               <label for="radio-2" class="radio-label">Vyras</label>
            </div>       
            <div class="radio inline">
                <input type="radio" id="radio-3" name="Lytis" value="Moteris" <%= user.gender =='Moteris'? 'checked' :''%>>
                <label for="radio-3" class="radio-label">Moteris</label>
             </div> 
        </div>
    
        <div class="form-group">
            <label for="Lytis" class="text-light">Statusas</label>
            <div class="radio inline">
                       <input type="radio" id="radio-4" name="status" value="Prisijunges" <%=user.status == 'Prisijunges'?'checked':''%>>
                       <label for="radio-4" class="radio-label">Aktyvus</label>
                    </div>       
                    <div class="radio inline">
                        <input type="radio" id="radio-5" name="status" value="Atsijunges" <%=user.status == 'Atsijunges'?'checked':''%>>
                        <label for="radio-5" class="radio-label">Neaktyvus</label>
                     </div> 
                </div>
    <div class="form-group">
       <button type="submit" class="btn text-dark update">Išsaugoti</button> 
    </div>
    
            </div>
    </form>    
    </div>
</main>
 <!-- /Main Site -->

show.ejs

<%for(var i = 0; i <users.length; i++){%>

<tr>
    <td><%= i + 1%></td>
    <td><%=users[i].name%></td>
    <td><%=users[i].email%></td>
    <td><%=users[i].gender%></td>
    <td><%=users[i].status%></td>
    <td>
        <a href="/update-user?id=<%=users[i]._id%>" class="btn border-shadow update">
            <span class="text-gradient"><i class="fas fa-user-edit"></i></span>
        </a>
        <a class="btn border-shadow delete" data-id=<%=users[i]._id%>>
         <span class="text-gradient"><i class="fas fa-user-slash"></i></span>
     </a>
    </td>
</tr>
<%}%>

index.ejs

<!--include header-->
    <%- include('include/_header')%>
<!--/include header-->

 <!-- Main Site -->
 <main id="site-main">
    <div class="container">
       <div class="box-nav d-flex justify-between">
           <a href="/add-user" class="border-shadow">
        <span class="text-gradient">Naujas Vartotojas<i class="fas fa-user-plus"></i></span>
        </a>
       </div>
 <!-- form handling -->
 <form action="/" method="POST">
<table class="table">
    <thead class="thead-dark">
        <tr>
            <th>ID</th>
            <th>Vardas</th>
            <th>@Email</th>
            <th>Lytis</th>
            <th>Statusas</th>
            <th>Būsena</th>
        </tr>
    </thead>
    <tbody>
        <%- include('include/_show')%>
   </tbody>
</table>
</form>     
    </div>
</main>
 <!-- /Main Site -->


<!--include footer-->
<%- include('include/_footer')%>
<!--/include footer-->

router.js

const express = require('express');
const route = express.Router()

const services = require('../services/render')
const controller = require('../controller/controller')

/**
 * @description Root Route
 * @method GET/
 */

route.get('/',services.homeRoutes)
    
/**
 * @description add users
 * @method GET/ add-user
 */    

    route.get('/add-user',services.add_user)
        
/**
 * @description for update user
 * @method GET/ update-user
 */  

    route.get('/update-user',services.update_user)
    
    // API
    
    route.post('/api/users',controller.create);
    route.get('/api/users',controller.find);
    route.put('/api/users/:id',controller.update);
    route.delete('/api/users/:id',controller.delete);

    module.exports = route

前端index.js

$('#add_user').submit(function(event){
    alert("Informacija išsaugota!")
})

$('#update-user').submit(function(event){
    event.preventDefault();

let unindexed_array =$(this).serializeArray();
let data = {}
$.map(unindexed_array,function(n,i){
data[n['name']]= n['value']
})

console.log(data)

let request = {
    "url" : `http://localhost:3000/api/users/${data.id}`,
    "method" : "PUT",
    "data" : data
}

$.ajax (request).done(function(response){
    alert("Naudotojas Atnaujintas!")
})

})

if(window.location.pathname == "/"){
    $ondelete=$(".table tbody td a.delete");
    $ondelete.click(function(){
        let id = $(this).attr("data-id")
   
        let request = {
            "url" : `http://localhost:3000/api/users/${id}`,
            "method" : "DELETE",
   
        }
   
   if(confirm("Ar tikrai norite ištrinti įraša?")){
    $.ajax (request).done(function(response){
        alert("Naudotojas ištrintas!")
    location.reload()
    })
   }
   
    })
}
问题原因及解决方案

问题核心为字段名不匹配:
表单里性别单选框的name属性设置为Lytis(立陶宛语“性别”的意思),但数据库存储、后端接口接收以及表格渲染用的字段名是gender。Postman请求时直接传了gender字段,所以能正常入库显示,但前端提交表单时,提交的是Lytis字段,后端接口没有对应处理这个字段,所以性别数据没有被存入数据库,表格渲染时自然为空。

修复步骤:

  1. 修改update user.ejs里两个性别单选框的name属性,把Lytis改为gender:
<input type="radio" id="radio-2" name="gender" value="Vyras" <%= user.gender =='Vyras'? 'checked' :''%>>
<input type="radio" id="radio-3" name="gender" value="Moteris" <%= user.gender =='Moteris'? 'checked' :''%>>
  1. 找到新增用户页面add-user.ejs,同样把性别单选框的name属性从Lytis改为gender即可。

内容的提问来源于stack exchange,提问作者Sidas Vidūnas

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.27 19:27:05