使用 post 方法提交表单后,表单数据附加到 php 中的 url 为啥?
Posted
技术标签:
【中文标题】使用 post 方法提交表单后,表单数据附加到 php 中的 url 为啥?【英文标题】:After submit form using post method form data appends to url in php why?使用 post 方法提交表单后,表单数据附加到 php 中的 url 为什么? 【发布时间】:2016-10-06 23:16:09 【问题描述】:我正在开发一个使用 ajax 发送表单数据的应用程序。成功后函数数据添加到数据库中,但它不显示任何消息,并且完整的表单数据附加到 url。 在这个我使用“POST”方法。 为什么此数据会附加到表单而不显示任何消息到结果字段。
这是我的html代码
<form class="form-horizontal form-label-left" id="myForm" novalidate>
<span class="section">Personal Info</span>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="fname"> First Name <span class="required">*</span>
</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input id="fname" class="form-control col-md-7 col-xs-12" data-validate-length-range="6" data-validate-words="1" name="fname" placeholder="First Name" required="required" type="text">
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="lname"> Last Name <span class="required">*</span>
</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input id="lname" class="form-control col-md-7 col-xs-12" data-validate-length-range="6" data-validate-words="1" name="lname" placeholder="Last Name" required="required" type="text">
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="username"> Username <span class="required">*</span>
</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input id="username" class="form-control col-md-7 col-xs-12" data-validate-length-range="0,25" data-validate-words="1" name="username" placeholder="Username" required="required" type="text">
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="email">Email <span class="required">*</span>
</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input type="email" id="email" name="email" required="required" class="form-control col-md-7 col-xs-12" placeholder="abc@gmail.com">
</div>
</div>
<div class="item form-group">
<label for="password" class="control-label col-md-3">Password <span class="required">*</span></label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input id="password" type="password" name="password" data-validate-length="6,8" class="form-control col-md-7 col-xs-12" required="required">
</div>
</div>
<div class="item form-group">
<label for="password2" class="control-label col-md-3 col-sm-3 col-xs-12">Repeat Password</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input id="password2" type="password" name="password2" data-validate-linked="password" class="form-control col-md-7 col-xs-12" required="required">
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="telephone">Telephone <span class="required">*</span>
</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input type="tel" id="telephone" name="telephone" required="required" data-validate-length-range="8,20" class="form-control col-md-7 col-xs-12">
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="status">Status</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<select id="status" name="status" class="form-control col-md-7 col-xs-12">
<option>Select Status</option>
<option value="ACTIVE" >Active</option>
<option value="INACTIVE">Inactive</option>
<option value="VACATION">Vacation</option>
</select>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12" for="role">Role</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<select id="role" name="role" class="form-control col-md-7 col-xs-12">
<option value="ACTIVE" >Select Role Name</option>
<option value="Manager" >Manager</option>
<option value="Operator">Operator</option>
<option value="Admin">Admin</option>
</select>
</div>
</div>
<div class="ln_solid"></div>
<div class="form-group">
<div class="col-md-6 col-md-offset-3">
<button type="reset" id="reset" class="btn btn-primary">Cancel</button>
<button id="send" type="submit" class="btn btn-success">Submit</button>
</div>
</div>
<div id="result"></div>
</form>
提交后,我调用我正在使用 ajax 的 js 文件。
ajax 函数
function processForm( e )
alert(e);
$.ajax(
url: 'add_user_check.php',
dataType: 'text',
type: 'post',
contentType: 'application/x-www-form-urlencoded',
data: $(this).serialize(),
success: function( data, textStatus, jQxhr )
alert(data);
var split = data.split(',');
var display = split[0];
var msg = split[1];
$('#result').html( msg );
,
error: function( jqXhr, textStatus, errorThrown )
$('#result').html( "Connection error :"+errorThrown);
);
e.preventDefault();
$('#myForm').submit( processForm );
如果数据提交成功,则返回成功消息并显示到结果字段。但是消息不显示并且完整的数据附加到 url。如图 为什么会发生这种情况?以及为什么它没有向结果字段显示正确的消息。
提前致谢。
【问题讨论】:
您能分享您的 PHP 数据吗?至少是回应? 并且您应该在您的 processForm 函数e.preventDefault()
中阻止默认使用表单 - 否则您的表单也会被提交。
您的表单正在提交,您的 ajax 函数从未被调用,或者表单在您的 ajax 函数被调用后提交。
After submit I call js file in which I am using ajax.
是什么意思?你的意思是你想做first
一个HTML提交和after
通过AJaX调用另一个脚本?或者你的意思是Instead of submit I want to call a a script via AJaX
?
【参考方案1】:
简而言之,因为没有真正的错误。 PHP 没有处理您的请求,因此继续其正常业务。 URL 像往常一样将 POST 数据卡在那里,只是它没有被刷新,因为它没有被重定向。
这是因为您实际上并没有为表单指定方法。
你需要使用
<form method="post" ....
【讨论】:
他写的是数据保存到数据库中,他使用ajax的方式,不需要form方法。【参考方案2】:在 html 表单中使用 method="post" 。
【讨论】:
他写的是数据保存到数据库中,他使用ajax的方式,不需要form方法。以上是关于使用 post 方法提交表单后,表单数据附加到 php 中的 url 为啥?的主要内容,如果未能解决你的问题,请参考以下文章
html中post必须要用form表单,而get就可以不用form表单就可以提交了吗?