[英]Jquery Popup form submit
我对ajax相当陌生,并且正在使用jquery mobile。 我正在做的是一个弹出窗口中的一个登录表单,我必须编写代码才能使两者都起作用,但是我不确定如何将两者连接起来以使其真正起作用。
这是弹出的HTML
<a href="#popupLogin" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-icon="check" data-theme="a" data-transition="pop">Login</a>
<div data-role="popup" id="popupLogin" data-overlay-theme="a" data-theme="a" class="ui-corner-all">
<form id="popuplogin">
<div style="padding:10px 20px;">
<h3>Please Login</h3>
<label for="un" class="ui-hidden-accessible">Username:</label>
<input type="text" name="user" id="un" value="" placeholder="username" data-theme="a">
<label for="pw" class="ui-hidden-accessible">Password:</label>
<input type="password" name="pass" id="pw" value="" placeholder="password" data-theme="a">
<button type="submit" data-theme="b" data-icon="check">Sign in</button>
</div>
</form>
</div>
这是我的剧本 我的问题是如何将两者连接在一起。
$("#popupLogin").submit(function() {
$.ajax({
type: "POST",
url: "submiturl",
data: $("input#name").val(),
success: function(html) {
// show the confirmation inside the popup
}
})
})
老实说,我什至不确定我是否完全理解ajax,但是不确定是否有人可以帮助我理解它。 这将不胜感激。
尝试这样的事情。
<button type="button" data-theme="b" data-icon="check" data-inline="true" onclick="validLogin()">Sign in</button>
通过添加onclick调用您的javascript函数。 IE连接这两段代码
然后在您的JavaScript中执行以下操作。
function validLogin(){
var uname=$('#uname').val();
var password=$('#password').val();
$.ajax({
type: "POST",
url: "scripts/processed.php",
data: {"uname": uname, "password":password},
cache: false,
success: function(result){
var result=trim(result);
if(result=='correct'){
window.location='index.php';
$('#loginForm').submit();
}else{
$("#loginerror").html(result);
return false;
}
}
});
}
那应该做你想要的。
看到这一行:
<a href="#popupLogin" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-icon="check" data-theme="a" data-transition="pop">Login</a>
和
<form id="popuplogin">
将<a href="#popupLogin"
更改为<a href="#popuplogin"
您的弹出代码看起来正确。 我会将您的表单代码更改为
<form id="formLogin" action="@submitUrl" method="post">
然后,您的“提交”按钮将无需提交任何JavaScript即可提交表单数据。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.