我正在使用Jquery移动框架工作,也是jquery mobile的新功能。我想通过Ajax追加一个html页面。首先,我在表单中按一个按钮(检查),但每当点击此按钮,然后附加页面,但布局将是损坏。我不知道如何在jquery mobile中通过ajax附加HTML页面。
SCINEN SHOT for HINTS:
HTML CODE:
<form id="checkPinCode1" method="get" data-uri="<c:url value="/pincode-available/${product.productId}/${product.productOfCityId}"/>" data-ajax="false">
<div style="margin-bottom: 20px; width: 80%;">
<input name="pinCode" type="number" class="form-control pinCode" placeholder=" Enter pincode here..">
</div>
<div style="margin-bottom: 20px; width:40%;">
<button class="btn btn-primary" type="submit" value="Check">Check</button>
</div>
</form>
<div id="showPincodeAvailablity">
<%--APPEND PAGE HERE--%>
</div>
AJAX代码:
$.ajax({
type: 'get',
url: url,
data: {pincode: pincode},
success: function (response) {
if (response.success === "true") {
$("#showPincodeAvailablity").html(response.html);
}
},
error: function (response) {
},
complete: function (response) {
}
});
JAVA CODE:
@RequestMapping(value = "/pincode-available/{productId}/{productOfCityId}", method = {RequestMethod.GET})
@ResponseBody
<%--- CODE LINE 1--%>
<%--- CODE LINE 2--%>
<%--- CODE LINE .....--%>
resp.put("success", "true");
resp.put("html", html);
}
首先我输入密码并单击检查按钮然后检查按钮控制转到控制器并进入ajax然后通过id = showPincodeAvailablity追加页面。和页面附加但页面布局不正确。给我一些实现此解决方案的想法。
答案 0 :(得分:0)
尝试更改此行
$("#showPincodeAvailablity").html(response.html);
到这个
$("#showPincodeAvailablity").html(response.html).enhanceWithin();