如何获取使用节点js选择单选按钮时出现的输入字段的内容?

时间:2019-07-10 20:01:25

标签: jquery node.js

对于我使用var name=request.body.name的文本框, 我将单选按钮命名为name="g",并将文本框命名为name="x",该文本框在单击单选按钮时显示。

我尝试使用以下语句获取“ x”的内容

  • var s=request.body.g.x
  • var s=request.body.x

在这两种情况下,x的值在我的mongoDB Atlas数据库中均显示为null。

console.log(required.body)

它只出现

name="name_value"  g="radio_button_value"

我应该如何获取x元素?

ejs文件:

<html>

  <body >
    <form>
<script src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
  <script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
  <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
   <!-- <link href="test2.css" rel="stylesheet" type="text/css"  /> -->

  <div id="mydiv"></div>
  <div id="mydiv1"></div>



<script type="text/babel">


class App extends React.Component {
  constructor(props){
  super(props);
  this.state={
  gender:" ",
}

  }
  set(e)
  {

    this.setState({
    gender:e.target.value
  })

  }
  subComponent(){


    if(this.state.gender=="MALE")
    return (<div>Hello World</div>);

  }
  subComponent2(){



    if(this.state.gender=="FEMALE")
    return (<div class="b">
      <form>
      <h2>Hello World1</h2>
      <input type="text" name="x"/>


    </form>
    </div>);

  }



  render() {
    return ( 
      <div >
        <form action="/reg" method="post"> 
        <h1>gender</h1>
        <input type="text" name="name"/><br/>
        <div class="container">

              <div class="row">
          <div class=" col-md-2 col-md-offset-4">
        <input type="radio" value="MALE" name="g" onChange={this.set.bind(this)} />Male
        </div>
        <br/>

        {this.subComponent()}
      </div>
      <div class="row">
       <div class=" col-md-2 col-md-offset-4">
        <input type="radio"  value="FEMALE" name="g" onChange={this.set.bind(this)}/>Female
        </div>
        <br/>
        {this.subComponent2()}
        </div>
        </div>
        <input type="submit" value="SUBMIT"/><br/>

</form>
      </div>
     )
  }
}
ReactDOM.render(<App/>, document.getElementById('mydiv'));



</script>

  </body>
</html>

js代码:

var express=require("express"); 
var bodyParser=require("body-parser"); 
var ejs = require('ejs');
var ejsMate = require('ejs-mate');


const mongoose = require('mongoose'); 
mongoose.connect(''); //database name
var db=mongoose.connection; 
db.on('error', console.log.bind(console, "connection error")); 
db.once('open', function(callback){ 
    console.log("connection succeeded"); 
}); 

var app=express();


app.use(bodyParser.json()); 
app.use(express.static('public')); 
app.use(bodyParser.urlencoded({ 
    extended: true
}));
app.engine('ejs',ejsMate);
app.set('view engine','ejs'); 

app.post('/reg', function(req,res){ 

    var name=req.body.name;
    var x=req.body.x;
    var data={
        "name":name,
        "x":x,
    }
    console.log(req.body);

db.collection('sample').insertOne(data,function(err, collection){ 
        if (err) throw err; 
        console.log("Record inserted Successfully"); 

    }); 

    return res.render('signup_success'); 
}) 

app.get('/',function(req, res){
    res.render('test');
});


app.get('/',function(req,res){ 
res.set({ 
    'Access-control-Allow-Origin': '*'
    }); 
return res.redirect('index.html'); 
}).listen(3001) 


console.log("server listening at port 3001");

0 个答案:

没有答案