「已注销」 2015-07-04 07:02 采纳率: 100%
浏览 3064
已采纳

Jquery Mobile Ajax ASP.NET控件 无刷新页面查询,添加,修改,删除

Jquery Mobile Ajax 技术用ASP.NET控件怎么实现无刷新页面查询,添加,修改,删除功能?
现在刷新一次才能执行JavaScript代码,否则没反应,有时候样式也没了。
我写的代码如下:

 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

    <title></title>

    <meta name="viewport" content="width=device-width, initial-scale=1" /> 

    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.css" />
    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css" />
    <script src="js/jquery.js"></script>
    <script src="js/jquery.mobile-1.4.5.min.js"></script>

</head>
<body>
    <form id="form1" runat="server">
        <div data-role="page" data-quicklinks="true">
            <div data-role="header"><h1>标题</h1></div>

            <div role="main">
            <ul data-role="listview">
                <li><a href="TestSql.aspx?key=1">AAA</a></li>
                <li><a href="TestSql.aspx?key=2">BBB</a></li>
            </ul>
            </div>

            <div data-role="footer" data-position="fixed"><h4>©2013-2015</h4></div>
        </div>
    </form>
</body>
</html>

 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestSql.aspx.cs" Inherits="TestSql" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <meta name="viewport" content="width=device-width, initial-scale=1" /> 

    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.css" />
    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css" />
    <script src="js/jquery.js"></script>
    <script src="js/jquery.mobile-1.4.5.min.js"></script>

</head>
<body>
    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>

            <div data-role="page">

            <div data-role="header"><h1>标题</h1><a href="Default.aspx" data-icon="arrow-r"><% =GetCityName() %></a></div>

            <div id="tabs" data-role="tabs">
              <div data-role="navbar">
                <ul>
                  <li><a href="#one" data-ajax="false">第一</a></li>
                  <li><a href="#two" data-ajax="false">第二</a></li>
                </ul>
              </div>
              <div class="ui-body-d ui-content" id="one">
                <asp:DropDownList data-native-menu="false" ID="ddlSort" runat="server" OnSelectedIndexChanged="ddlSort_SelectedIndexChanged"></asp:DropDownList>
                <asp:DropDownList data-native-menu="false" ID="ddlCity" runat="server"></asp:DropDownList>
                <asp:Button ID="btnSearch" runat="server" Text="查询" CssClass="ui-btn-active" />
              </div>
              <div id="two">
                <ul data-role="listview" data-inset="true">
                    <li><a href="#">A</a></li>
                    <li><a href="#">B</a></li>
                    <li><a href="#">C</a></li>
                    <li><a href="#">D</a></li>
                    <li><a href="#">E</a></li>
                </ul>
              </div>
            </div>

            <div data-role="footer" data-position="fixed"><h4>©2013-2015</h4></div>

            </div>

            </ContentTemplate>
        </asp:UpdatePanel>

    </form>
</body>
</html>

 using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

public partial class TestSql : System.Web.UI.Page
{
    SqlEditForOleDb ed = new SqlEditForOleDb();

    string CityNumber = string.Empty;

    int StationSortIndex = 0;
    string StationSortName = string.Empty;

    int StationIndex = 0;
    string StationName = string.Empty;

    protected void Page_Load(object sender, EventArgs e)
    {

        try
        {
            CityNumber = Request.QueryString["key"].ToString();
            Session["CityID"] = CityNumber;
            if (CityNumber == string.Empty)
            {
                Response.Redirect("Default.aspx");
            }
        }
        catch
        {
            Response.Redirect("Default.aspx");
        }

        ddlSort.AutoPostBack = true;
        ddlCity.AutoPostBack = true;

        if (!IsPostBack)
        {
            ddlSort.Items.Add("A");
            ddlSort.Items.Add("B");
            ddlSort.Items.Add("C");
            ddlSort.Items.Add("D");
            ddlSort.Items.Add("E");
            ddlCity.Enabled = false;
        }
        else if (ddlSort.SelectedIndex == 0)
        {
            ddlCity.Enabled = false;
        }

        StationSortName = ddlSort.Text;
        StationSortIndex = ddlSort.SelectedIndex;
        StationName = ddlCity.Text;
        StationIndex = ddlCity.SelectedIndex;
    }

    public string GetCityName()
    {
        string str = string.Empty;
        try
        {
            str = ed.Search("SELECT 名称 FROM 城市 WHERE ID = " + CityNumber).Rows[0][0].ToString();
        }
        catch
        { }
        return str;
    }

    public string GetCityID()
    {
        string str = string.Empty;
        try
        {
            str = Session["CityID"].ToString();
        }
        catch
        { }
        return str;
    }

    protected void ddlSort_SelectedIndexChanged(object sender, EventArgs e)
    {
        ddlCity.Items.Clear();

        if (ddlSort.SelectedIndex == 0)
        {
            ddlCity.Enabled = false;
        }
        else
        {
            ddlCity.Enabled = true;
            DataTable dtStation = new DataTable();
            dtStation = ed.Search("SELECT DISTINCT 城市.名称 FROM 城市 WHERE 城市.名称 like '" + StationSortName + "%'");

            for (int i = 0; i < dtStation.Rows.Count; i++)
            {
                ddlCity.Items.Add(dtStation.Rows[i][0].ToString());
            }
        }
    }

}
  • 写回答

9条回答 默认 最新

  • M拉丁 2019-12-18 15:48
    关注
        The problem you have been encountered was also the same issue I have ever faced. Personally, if u want to make an Ajax request, you
        may want to use a javascript framework. ASP.NET MVC ships wirh Jquery, so this example assuemes you have Jquery all ready to rock.
    
    <button id="MyButton" />
    
    <script type="text/javascript">
        // This will bind a javascript event handler to the button(s) identified
        // by the CSS selector #MyButton.
        //
        // You could also use the onclick event in the <input> element to 
        // say, call a javascript function... but this couples the HTML to
        // the Javascript logic in a way that is less maintainable as things
        // get more complex.
        $("#MyButton").click(function () {
    
            // $ is a global reference to JQuery. This instantiates and executes
            // a JQuery request using the browsers native request object (different
            // browsers do this slightly differently, this is why you need a 
            // framework like JQuery to write Javascript productively)
            $.ajax(
    
                // This is the URL back to an ASP.NET controller\action that will handle the event.
                url: "{controller}/{action}",
    
                                // This is a callback function that will execute when the round trip completes.
                success: function (response) {
                    alert("server response: " + response);
                }
            );
        });
    </script>
    

    You can also visit to this page http://api.jquery.com/jQuery.ajax/

    Goodluck.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(8条)

报告相同问题?

悬赏问题

  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!
  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像,如何解决?
  • ¥15 求daily translation(DT)偏差订正方法的代码
  • ¥15 js调用html页面需要隐藏某个按钮
  • ¥15 ads仿真结果在圆图上是怎么读数的
  • ¥20 Cotex M3的调试和程序执行方式是什么样的?
  • ¥20 java项目连接sqlserver时报ssl相关错误
  • ¥15 一道python难题3
  • ¥15 牛顿斯科特系数表表示