C# 未将数据从$.ajax发布到.Net核心asp.Net mvc方法
这是我的服务器端方法（通过邮递员获取数据） 下面是javascript的.jsx代码：C# 未将数据从$.ajax发布到.Net核心asp.Net mvc方法,c#,asp.net,reactjs,C#,Asp.net,Reactjs,这是我的服务器端方法（通过邮递员获取数据） 下面是javascript的.jsx代码： $.ajax({ url: "Home/RegisterNewUser", type: "POST", data: JSON.stringify(this.state), dataType: "json", contentType: "applica
$.ajax({
url: "Home/RegisterNewUser",
type: "POST",
data: JSON.stringify(this.state),
dataType: "json",
contentType: "application/json",
success: function (status) {
console.log(status);
if (status == '200') {
alert('You are registered now !!');
this.setState({ Email: '', FirstName: '', LastName: '', LastNamePrefix: '', AcceptTerms: false, CompanyName: '' });
}
else {
alert(' you are not registered !!');
}
$('#forgetEmailId').val('');
$('#divGetPass').css('display', 'none');
$('#getPass').val('Send My Password on Email');
},
error: function () {
alert('Some error occured !!');
}
});
var RegistrationBox = React.createClass({
getInitialState: function () {
return {Email:'', FirstName: '', LastName: '',LastNamePrefix:'',AcceptTerms:false,CompanyName:'' };
},
handleEmailChange: function (e) {
this.setState({Email: e.target.value });
},
handleFirstNameChange: function (e) {
this.setState({ FirstName: e.target.value });
},
handleLastNamePrefixChange: function (e) {
this.setState({ LastNamePrefix: e.target.value });
},
handleLastNameChange: function (e) {
this.setState({ LastName: e.target.value });
},
handleCompanyNameChange: function (e) {
this.setState({ CompanyName: e.target.value });
},
handleAcceptChange: function (e) {
this.setState({ AcceptTerms: e.target.checked });
},
toggleIsChecked: function () {
this.setState({ AcceptTerms: !this.state.checked });
},
handleReset: function (e) {
this.setState({ Email:'', FirstName: '', LastName: '', LastNamePrefix: '', AcceptTerms: false, CompanyName: '' });
},
handleSubmit: function (e) {
e.preventDefault();
var email = this.state.Email.trim();
var fName = this.state.FirstName.trim();
var lName = this.state.LastName.trim();
var lNamePrefix = this.state.LastNamePrefix.trim();
var cName = this.state.CompanyName.trim();
var aTerms = this.state.AcceptTerms;
if (email == null || fName == null || lName == null ||
lNamePrefix == null || cName == null || aTerms == null) {
return;
}
if (aTerms == false){
alert('Please accept Terms');
return;
}
else //Make Ajax Call
{
$.ajax({
url: "Home/RegisterNewUser",
type: "POST",
data: JSON.stringify(this.state),
dataType: "json",
contentType: "application/json",
success: function (status) {
console.log(status);
if (status == '200') {
alert('You are registered now !!');
this.setState({ Email: '', FirstName: '', LastName: '', LastNamePrefix: '', AcceptTerms: false, CompanyName: '' });
}
else {
alert(' you are not registered !!');
}
$('#forgetEmailId').val('');
$('#divGetPass').css('display', 'none');
$('#getPass').val('Send My Password on Email');
},
error: function () {
alert('Some error occured !!');
}
});
}
},
render: function () {
var chkBoxStyle = {
width: 25,
height: 25,
};
var chkboxlabel = {
margin: 8
};
return (
<div className="registrationBox">
<form method="post" id="user-registration-form" data-parsley-validate className="form-horizontal form-label-left">
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Email <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleEmailChange} value={this.state.Email} type="text" id="email" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
First Name <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleFirstNameChange} value={this.state.FirstName} type="text" id="first-name" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Last Name Prefix<span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleLastNamePrefixChange} value={this.state.LastNamePrefix} type="text" id="last-name-prefix" name="last-name-prefix" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Last Name <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleLastNameChange} value={this.state.LastName} type="text" id="last-name" name="last-name" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label
style={chkboxlabel}
className="control-label col-md-3 col-sm-3 col-xs-12">
Accept Terms & Conditions
<span className="required">*</span>
</label>
<div className="checkbox col-md-6 col-sm-6 col-xs-12">
<div style={{ float: 'left', width: 60, paddingLeft: 5 }}>
<input onChange={this.handleAcceptChange} checked={this.state.AcceptTerms} type="checkbox" id="accept"
name="accept" required="required" style={chkBoxStyle} />
</div>
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Company Name <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleCompanyNameChange} value={this.state.CompanyName} type="text" id="company-name" name="compnay-name" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<div className="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">
<button className="btn btn-primary" type="button">Cancel</button>
<button onClick={this.handleReset} className="btn btn-primary" type="reset">Reset</button>
<button onClick={this.handleSubmit} type="button" className="btn btn-success">Submit</button>
</div>
</div>
</form>
</div>
);
}
});
ReactDOM.render(
<RegistrationBox />,
document.getElementById('registration-div')
);
我们可以查看您的客户端模型（或表单）吗？更新的代码和屏幕截图@JoePhillipsShow UserModel以及url:Home/RegisterNewUser->url:localhost:51251/Home/RegisterNewUser
数据：JSON.stringify（this.state）-为什么要对模型进行stringify？这应该没有必要。很可能是将一个字符串参数传递给服务器，该参数看起来像JSON，但被视为一个字符串（而不是具有多个属性的对象）。您可以通过查看浏览器的“网络”选项卡查看请求正文中的内容来验证这一点，但我非常确定您是否只执行了数据：this.state数据：{user:this.state}this.statevar RegistrationBox = React.createClass({
getInitialState: function () {
return {Email:'', FirstName: '', LastName: '',LastNamePrefix:'',AcceptTerms:false,CompanyName:'' };
},
handleEmailChange: function (e) {
this.setState({Email: e.target.value });
},
handleFirstNameChange: function (e) {
this.setState({ FirstName: e.target.value });
},
handleLastNamePrefixChange: function (e) {
this.setState({ LastNamePrefix: e.target.value });
},
handleLastNameChange: function (e) {
this.setState({ LastName: e.target.value });
},
handleCompanyNameChange: function (e) {
this.setState({ CompanyName: e.target.value });
},
handleAcceptChange: function (e) {
this.setState({ AcceptTerms: e.target.checked });
},
toggleIsChecked: function () {
this.setState({ AcceptTerms: !this.state.checked });
},
handleReset: function (e) {
this.setState({ Email:'', FirstName: '', LastName: '', LastNamePrefix: '', AcceptTerms: false, CompanyName: '' });
},
handleSubmit: function (e) {
e.preventDefault();
var email = this.state.Email.trim();
var fName = this.state.FirstName.trim();
var lName = this.state.LastName.trim();
var lNamePrefix = this.state.LastNamePrefix.trim();
var cName = this.state.CompanyName.trim();
var aTerms = this.state.AcceptTerms;
if (email == null || fName == null || lName == null ||
lNamePrefix == null || cName == null || aTerms == null) {
return;
}
if (aTerms == false){
alert('Please accept Terms');
return;
}
else //Make Ajax Call
{
$.ajax({
url: "Home/RegisterNewUser",
type: "POST",
data: JSON.stringify(this.state),
dataType: "json",
contentType: "application/json",
success: function (status) {
console.log(status);
if (status == '200') {
alert('You are registered now !!');
this.setState({ Email: '', FirstName: '', LastName: '', LastNamePrefix: '', AcceptTerms: false, CompanyName: '' });
}
else {
alert(' you are not registered !!');
}
$('#forgetEmailId').val('');
$('#divGetPass').css('display', 'none');
$('#getPass').val('Send My Password on Email');
},
error: function () {
alert('Some error occured !!');
}
});
}
},
render: function () {
var chkBoxStyle = {
width: 25,
height: 25,
};
var chkboxlabel = {
margin: 8
};
return (
<div className="registrationBox">
<form method="post" id="user-registration-form" data-parsley-validate className="form-horizontal form-label-left">
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Email <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleEmailChange} value={this.state.Email} type="text" id="email" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
First Name <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleFirstNameChange} value={this.state.FirstName} type="text" id="first-name" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Last Name Prefix<span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleLastNamePrefixChange} value={this.state.LastNamePrefix} type="text" id="last-name-prefix" name="last-name-prefix" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Last Name <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleLastNameChange} value={this.state.LastName} type="text" id="last-name" name="last-name" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<label
style={chkboxlabel}
className="control-label col-md-3 col-sm-3 col-xs-12">
Accept Terms & Conditions
<span className="required">*</span>
</label>
<div className="checkbox col-md-6 col-sm-6 col-xs-12">
<div style={{ float: 'left', width: 60, paddingLeft: 5 }}>
<input onChange={this.handleAcceptChange} checked={this.state.AcceptTerms} type="checkbox" id="accept"
name="accept" required="required" style={chkBoxStyle} />
</div>
</div>
</div>
<div className="form-group">
<label className="control-label col-md-3 col-sm-3 col-xs-12">
Company Name <span className="required">*</span>
</label>
<div className="col-md-6 col-sm-6 col-xs-12">
<input onChange={this.handleCompanyNameChange} value={this.state.CompanyName} type="text" id="company-name" name="compnay-name" required="required" className="form-control col-md-7 col-xs-12" />
</div>
</div>
<div className="form-group">
<div className="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">
<button className="btn btn-primary" type="button">Cancel</button>
<button onClick={this.handleReset} className="btn btn-primary" type="reset">Reset</button>
<button onClick={this.handleSubmit} type="button" className="btn btn-success">Submit</button>
</div>
</div>
</form>
</div>
);
}
});
ReactDOM.render(
<RegistrationBox />,
document.getElementById('registration-div')
);
public class UserModel
{
public string Email { get; set; }
public string FirstName { get; set; }
public string LastNamePrefix { get; set; }
public string LastName { get; set; }
public bool AcceptTerms { get; set; }
public string CompanyName { get; set; }
}