1

我已经在网上到处搜索了两天才能找到这个。到目前为止，我还没有找到我需要的东西。我不确定是不是因为我在用 AJAX 做一些奇怪的事情，但这是我的问题，如果你能帮忙的话。

我正在尝试制作一个只有多个页面但使用 AJAX 和 JQuery 来给人一种只有一页的错觉的网站。URL 没有像预期的那样更改，但是当我尝试创建销售人员或使用 AJAX 加载页面登录时，它不起作用。看起来确实如此，但实际上并没有提交数据输入，因为后面的代码永远不会在单独的页面上命中。以下代码是我的 AJAX 页面。

/// <reference path="jquery-1.8.2-vsdoc.js" />
$(document).ready(function () {
$('#ViewAllUsers').click(function () {
    $.ajax({
        type: 'POST',
        url: "/ViewAllUsers(test).aspx",
        success: function (result) {
            var main = $('#Main');
            main.html($('#Main', result).html());
        }
    });
});
$('#Button1').click(function () {
    $.ajax({
        type: 'POST',
        url: "/Login.aspx",
        success: function (result) {
            var main = $('#Main');
            main.html($('#Main', result).html());
        }
    });
});
$('#AddItem').click(function () {
    $.ajax({
        type: 'POST',
        url: "/admin/AddItem.aspx",
        success: function (result) {
            var main = $('#Main');
            main.html($('#Main', result).html());
        }
    });
});
$('#CreateSalesAccount').click(function () {
    $.ajax({
        type: 'POST',
        url: "/admin/CreateSalesAccount.aspx",
        success: function (result) {
            var main = $('#Main');
            main.html($('#Main', result).html());
        }
    });
});
$('#ViewAllOrderHistory').click(function () {
    $.ajax({
        type: 'POST',
        url: "/admin/ViewOrderHistory.aspx",
        success: function (result) {
            var main = $('#Main');
            main.html($('#Main', result).html());
        }
    });
});
});

此代码是管理页面，该页面使用 AJAX 按钮转到其他页面，同时停留在管理页面上。

<%@ Page Title="" Language="vb" AutoEventWireup="true" MasterPageFile="~/Site.Master" CodeBehind="AdminPage.aspx.vb" Inherits="PyriteGoldPresentation.AdminPage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script src="../Scripts/jquery-1.8.2.js" type="text/javascript"></script>
<script src="../Scripts/PyriteGoldAjax.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id = "Main">
    <input type="button" id="ViewAllUsers" value="View All Users" />
    <input type="button" id="AddItem" value = "Add Item" />
    <input type="button" id="CreateSalesAccount" value="Create A Sales Account" />
    <input type="button" id="ViewAllOrderHistory" value="View Order History" />
</div>
</asp:Content>

Finnaly 这里是创建推销员页面及其背后的代码。

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="CreateSalesAccount.aspx.vb" Inherits="PyriteGoldPresentation.CreateSalesAccount"%>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script src="../Scripts/jquery-1.8.2.js" type="text/javascript"></script>
<script src="../Scripts/PyriteGoldAjax.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id="Main">
    <div style="width: 400px; margin-left:auto; margin-right:auto;">
        <div class="row">
            <h2>
                Create Sales Account
            </h2>
        </div>
        <div class="row">
            <span class="column1">
                <asp:Label ID="FirstNameLabel" runat="server" Text="First Name"/>
            </span>
            <span class="column2">
                <asp:TextBox ID="FirstNameTextField" runat="server" Width="137px"/>
            </span>
            <span class="column3">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="*Required Field"
                 ControlToValidate="FirstNameTextField"/>
            </span>
        </div>
        <div class="row">
            <span class="column1">
                <asp:Label ID="LastNameLabel" runat="server" Text="Last Name"/>
            </span>
            <span class="column2">
                <asp:TextBox ID="LastNameTextBox" runat="server" Width="137px"/>
            </span>
            <span class="column3">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="*Required Field" ControlToValidate="LastNameTextBox"/>
            </span>
        </div>
        <div class="row">
            <span class="column1">
                <asp:Label ID="EmailLabel" runat="server" Text="E-Mail Address"/>
            </span>
            <span class="column2">
                <asp:TextBox ID="EmailTextBox" runat="server" Width="134px"/>
            </span>
            <span class="column3">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="*Required Field" ControlToValidate="EmailTextBox"/>
            </span>
        </div>
        <div class="row">
            <span class="column1">
                <asp:Label ID="VerifyEmailLabel" runat="server" Text="Verify E-Mail"/>
            </span>
            <span class="column2">
                <asp:TextBox ID="VerifyEmailTextBox" runat="server" Width="136px"/>
            </span>
            <span class="column3">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="*Required Field" ControlToValidate="VerifyEmailTextBox"/>
            </span>
        </div>
        <div class="row">
            <span class="column1">
                <asp:Label ID="PasswordLabel" runat="server" Text="Password"/>
            </span>
            <span class="column2">
                <asp:TextBox ID="PasswordTextBox" runat="server" Width="138px" 
                TextMode="Password"/>
            </span>
            <span class="column3">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="*Required Field" ControlToValidate="PasswordTextBox"/>
            </span>
        </div>
        <div class="row">
            <span class="column1">
                <asp:Label ID="VerifyPasswordLabel" runat="server" Text="Verify Password"/>
            </span>
            <span class="column2">
                <asp:TextBox ID="VerifyPasswordTextBox" runat="server" Width="138px" 
                TextMode="Password"/>
            </span>
            <span class="column3">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ErrorMessage="*Required Field" ControlToValidate="VerifyPasswordTextBox"/>
            </span>
        </div>
        <div class="row" style="color:Red;">
            <asp:CompareValidator ID="EmailValidator" runat="server" ErrorMessage="**E-mail Feilds Must Match" ControlToCompare="EmailTextBox" ControlToValidate="VerifyEmailTextBox"/><br />
            <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" 
            ErrorMessage="**E-mail Addresses must follow the pattern user@domain.com" ControlToValidate="EmailTextBox" 
            ValidationExpression="\w+([-+.']\w+[-]*)*@\w+([-.]*\w+)*\.\w+([-.]\w+)*"/><br />
            <asp:CompareValidator ID="PasswordValidator" runat="server" ErrorMessage="**Password Fields Must Match" ControlToCompare="PasswordTextBox" ControlToValidate="VerifyPasswordTextBox"/>
        </div>
        <div>
            <asp:Button ID="SubmitButton" runat="server" Text="Submit" OnClick="SubmitButton_Click" />
        </div>
    </div>
</div>
</asp:Content>

代码背后

Imports PyriteGoldBLL
Imports PyriteGoldModel

Public Class CreateSalesAccount
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If Session("permissionValue") <> 3 Then
        Response.Redirect("~/Home.aspx")
    End If
End Sub

Protected Sub SubmitButton_Click(sender As Object, e As EventArgs) Handles SubmitButton.Click
    Dim userLogic As New UserLogic()
    Dim user As New User()
    With user
        .FirstName = FirstNameTextField.Text
        .LastName = LastNameTextBox.Text
        .Email = EmailTextBox.Text
        .Password = PasswordTextBox.Text
        .Activated = True
        .Permission = 2
    End With
    userLogic.CreateUser(user)
End Sub

结束类

4

1 回答 1

1

我不是 100% 追随你想要达到的目标.. 虽然无论如何都要尝试一下:)

您正在尝试调用 AJAX 中的实际页面，而不是尝试调用 webmethod - 这是您需要做的......您不能以您尝试的方式调用您尝试调用的内容称它为...

我建议您创建一个包含您需要的所有方法的 Web 服务，例如 login、addItem 等。这些方法需要获取您需要的属性，IE Login 可能需要用户名和密码。

如果您不想创建 Web 服务，那么您必须将所有这些方法放入 ajax 所在的同一页面中。

例如：对于您的 ajax 登录 URL 是您的 Web 服务，后跟“/”，后跟方法名称。

$('#Button1').click(function () {
$.ajax({
    type: 'POST',
    url: "/MyWebservice.asmx/Login",
    data: "{'username':'" + YourUserNameVar + "', 'password':'" + YourPasswordVar +"'}",
    success: function (result) {
        var main = $('#Main');
        main.html($('#Main', result).html());
    }
});

});

接收此调用的方法如下所示：

     <WebMethod()> _
    <ScriptMethod(ResponseFormat:=ResponseFormat.Json)> _
    Public Function Login(ByVal username As String, ByVal password as string) As Object

       '' Do your login here and return whatever it is you need to return
       '' i have used 'Object' for this function by way of example

    End Function

这个答案当然可以用更多的信息来充实，尽管这更多是为了让你开始并走上正确的道路。

更新：

您需要了解一些关于使用 AJAX 使用 Web 方法/Web 服务的知识。看看这个简单的教程。显示您需要开始的所有步骤:)

于 2012-10-25T19:20:35.783 回答