如何搭配jQuery Mobile的和ASP.NET [英] How to mix jQuery Mobile and ASP.NET

查看:112
本文介绍了如何搭配jQuery Mobile的和ASP.NET的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在做一个移动网站,使用jQuery Mobile和ASP.NET 4.0 Web表单。我做了一个初始的登录页面(Default.aspx的),其中按钮调用一个Ajax的JavaScript函数,该函数调用像这样的后台页面的方法:

I'm making a mobile website, using jQuery Mobile and ASP.NET 4.0 Webforms. I have made an initial login page (Default.aspx) in which the button calls an ajax JavaScript function, which calls a page method in the backend like so:

的Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="UCP.Default" %>
<!DOCTYPE html>
<html>
<head>
    <title>UA Cover Plus</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
</head>
<body>
    <!-- Login -->
    <div data-role="page" id="login">
        <div data-role="header" data-position="fixed">
           <h1>Login</h1>
            <a href="#Family" data-icon="gear" class="ui-btn-right" data-iconpos="notext" data-theme="b" >Options</a>
        </div>
       <div data-role="content" data-theme="a">   
            <input type="text" id="txtUserName" placeholder="Username" />
            <input type="password" name="passwordinput" id="txtPassword"  placeholder="Password" value=""  />
            <a href="javascript:Authenticate();" data-role="button" data-icon="check" data-iconpos="right">Log Me In!</a>
       </div><!-- /content -->
    </div><!-- /page -->
</body>

阿贾克斯JQuery的功能:

function Authenticate() {
    $.ajax({
        type: "POST",
        url: "Default.aspx/Authenticate",
        data: "{'name': '" + $('#txtUserName').val() + "','pass': '" + $('#txtPassword').val() + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            if (msg.d != '-1') {
                userId = msg.d;
                GetCustomisedConsole();
            } else {
                alert("Authentication Failed");
            }
        },
        error: function () {
            alert("Error :(");
        }
    });
};

在Default.aspx.cs 页方法

Page method in Default.aspx.cs

    [WebMethod]
    public static int Authenticate(string name, string pass)
    {
        using (DbContext db = new DbContext())
        {
            var user = db.Users.Where(x => x.UserName == name && x.Password == pass).SingleOrDefault();
            if (user != null)
            {
                return user.Id;
            }
            else
            {
                return -1;
            }
        }
    }

我的问题是,是这样的方式它的意思做些什么呢?我问这个,因为我在jQuery的例子中看到使用表格并提交,我不知道如何在asp.net中实现。

My question is, is this the way its meant to be done? I ask this because I see in the jQuery examples the use of forms and submits, which I have no idea how to implement in asp.net.

推荐答案

我在做同样的方式和完美的作品。

I'm doing in the same way and works perfect.

请看看这个例子

调用服务器方法使用jQuery

这篇关于如何搭配jQuery Mobile的和ASP.NET的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆