使用ASP.NET和ajax无法使用回传加载网页？ [英] Loading webpage without post back using ASP.NET and ajax not working?
问题描述
总结一下我要做的事情，我在我的网站上创建了两个表单，当用户点击下一个或上一个按钮时，它应该从一个表单转换到另一个表单而不回发。但问题是，当我点击下一步时，它什么也没做。我已经在我的ajax代码中定位了相应的id和url，但它仍然无效。截至目前，我正在使用ajax用于那些非post post，我的网站是用asp.net构建的。希望你们可以帮我这个。
我尝试过：
以下是ajax（loader.js）的代码：
$（ document ）.ready（ function （）{
$ .ajaxSetup（{
cache： false ，
dataType： aspx，
错误： function （xhr，status，error）{
alert（' 发生错误：' +错误）;
}，
超时： 30000 ，
类型： GET，
beforeSend： function （）{
console .log（' 在Ajax完成函数'）;
}
}）;
$（ ＃btnNext）。click（ function （e）{
e.preventDefault（）;
$ .ajax（{
url： Pages / CreateNewItems2.aspx，
成功： function （数据）{
$（ ＃ContentPlaceHolder1）。aspx（ ）。append（data）;
}
}）;
}）;
}）;
这是我网站的主页：
<％@ Master 语言 = C＃ AutoEventWireup = < span class =code-keyword> true CodeFile = MasterPage.master.cs 继承 = MasterPage ％>
< ！DOCTYPE html >
< html xmlns = http://www.w3.org/1999/xhtml >
< head runat = 服务器 >
< script src = .. /Javascript/jquery-1.11.2.min.js\"> < < span class =code-keyword> / script >
< span class =code-keyword>< script src = ../ Javascript / loader.js > < / script >
< link rel = 样式表 href = 〜/ Styles / jquery.bxslider.css / >
< link rel = stylesheet href = 〜/ Styles / StyleSheet.css / >
< link rel = stylesheet href = 〜/ Styles / font-awesome.min.css / >
< link rel = 快捷图标 type = image / png < span class =code-attribute> href = 〜/ Images / rockSign.png / >
&升t; style type = text / css >
。 auto-style2 {
height ： 298px;
}
< / < span class =code-leadattribute> style >
< / head >
< body >
< 表格 id = form1 runat = server >
< div id = 包装 >
< < span class =code-leadattribute> header id = main_header >
< div id = callout >
< h2 > &安培;＃9742; 111222333 < / h2 >
< p > 密歇根州立川崎冰岛< / p >
< / div >
< h1 > ; MUSIC STORE < / h1 > ;
< / header >
< div class = clearfix > < / div >
< nav id = nav_menu < span class =code-keyword>>
< ul id = nav >
< li > < a href = 〜/ Pages / Home.aspx < span class =code-attribute> runat = server > HOME < / a > < / li >
< li > < a href = ＃ > INSTRUMENTS < / a >
< ul class = 子菜单 >
< li > < a href = 〜/ Pages / GuitarBrands.aspx runat = 服务器 > 电吉他< / a > < / li >
< li > < a href = ＃ > BASS GUITARS < / a > < / li >
< li > < a href = ＃ > ; DRUMS < / a > < / li >
< / ul >
< / li >
< li > < a href = ＃ > AMPLIFIERS < / a > < < span class =code-leadattribute> / li >
< li > < a href = ＃ > 附件< / a > < span class =code-keyword>< / li >
< li > < a href = ＃ > 特色艺术家< / a > < / li >
< li > < a href = ＃ > < img src = ../ Images / cog.png / > < / a >
< ul class = < span class =code-keyword> cog_submenu >
< li > < a href = 〜/ Pages / NewBrands.aspx runat = server > 创建新品牌< / a > < / li >
< li > < a href = < span class =code-keyword>＃ > 使用现有品牌< / a > < / li >
< li > < a href = 〜/ Pages / OverviewData.aspx runat = 服务器 > 数据概述< / a > < / li >
< / ul >
< / li >
< / ul >
< / nav >
< div id = content_area >
< asp：ContentPlaceHolder ID = ContentPlaceHolder1 runat = server >
< / asp：ContentPlaceHolder >
< / div >
< div class = clearfix > < / div >
< 页脚 >
< p > & copy;保留所有权利< / p >
< / footer >
< / div >
< / form >
< / body >
< / html >
这是第一个表格的代码，它有下一个按钮：
（ document ）。ready（ function （）{
To summarize what I'm trying to do, I've created two forms in my website that when the user clicked the next or prev button, it should supposedly transition from one form to the other without post back. But the problem is when I click next, it doesn't do anything. I have already targeted the respective id's and url in my ajax code but its still not working. As of now, I'm using ajax for those non-post backs and my website is built in asp.net. Hope you guys can help me with this one. 这篇关于使用ASP.NET和ajax无法使用回传加载网页？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
cache： false ，
dataType： < span class =code-string> aspx，
错误： function （xhr，status，error）{
alert （' 发生错误：' +错误）;
}，
超时： 30000 ，
类型： < span class =code-string> GET，
beforeSend： function （）{
console .log（' 在Ajax完成函数'）;
}
}）;
（ ＃ btnNext）。点击（ function （e）{
e.preventDefault（）;
What I have tried:
Here is the code below for ajax(loader.js):
$(document).ready(function () {
$.ajaxSetup({
cache: false,
dataType: "aspx",
error: function (xhr, status, error) {
alert('An error occured:' + error);
},
timeout: 30000,
type: "GET",
beforeSend: function () {
console.log('In Ajax complete function');
}
});
$("#btnNext").click(function (e) {
e.preventDefault();
$.ajax({
url: "Pages/CreateNewItems2.aspx",
success: function (data) {
$("#ContentPlaceHolder1").aspx("").append(data);
}
});
});
});
Here is the masterpage for my website:
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="../Javascript/jquery-1.11.2.min.js"></script>
<script src="../Javascript/loader.js"></script>
<link rel="stylesheet" href="~/Styles/jquery.bxslider.css"/>
<link rel="stylesheet" href="~/Styles/StyleSheet.css"/>
<link rel="stylesheet" href="~/Styles/font-awesome.min.css"/>
<link rel="shortcut icon" type="image/png" href="~/Images/rockSign.png"/>
<style type="text/css">
.auto-style2 {
height: 298px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="wrapper">
<header id="main_header">
<div id="callout">
<h2>☎ 111222333</h2>
<p>Michigan State Kawasaki Iceland</p>
</div>
<h1>MUSIC STORE</h1>
</header>
<div class="clearfix"></div>
<nav id="nav_menu">
<ul id="nav">
<li><a href="~/Pages/Home.aspx" runat="server">HOME</a></li>
<li><a href="#">INSTRUMENTS</a>
<ul class="sub-menu">
<li><a href="~/Pages/GuitarBrands.aspx" runat="server">ELECTRIC GUITARS</a></li>
<li><a href="#">BASS GUITARS</a></li>
<li><a href="#">DRUMS</a></li>
</ul>
</li>
<li><a href="#">AMPLIFIERS</a></li>
<li><a href="#">ACCESSORIES</a></li>
<li><a href="#">FEATURED ARTISTS</a></li>
<li><a href="#"><img src="../Images/cog.png" /></a>
<ul class="cog_submenu">
<li><a href="~/Pages/NewBrands.aspx" runat="server">CREATE NEW BRAND</a></li>
<li><a href="#">USE EXISTING BRAND</a></li>
<li><a href="~/Pages/OverviewData.aspx" runat="server">DATA OVERVIEW</a></li>
</ul>
</li>
</ul>
</nav>
<div id="content_area">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="clearfix"></div>
<footer>
<p>©All Rights Reserved</p>
</footer>
</div>
</form>
</body>
</html>
And here is the code for the 1st form which has the next button:
(document).ready(function () {
.ajaxSetup({
cache: false,
dataType: "aspx",
error: function (xhr, status, error) {
alert('An error occured:' + error);
},
timeout: 30000,
type: "GET",
beforeSend: function () {
console.log('In Ajax complete function');
}
});
("#btnNext").click(function (e) {
e.preventDefault();
