Question

首先让我告诉你我的流程

我想建立座位预订申请（实时）。我使用c＃，ajax，jquery和sql-server作为数据库。我有3页 index.html（用户界面）,. js（用于jQuery，打印座位，座位位置也是html和aspx的桥梁），以及aspx（操纵数据库）

当您运行Index.html时，您会看到座位，您可以点击它并输入结束时间，然后您的座位会将颜色更改为红色。如果当前时间与您的结束时间相等，那么您的座位颜色将从红色变为绿色。

预订时，

座位将变为红色。并且您的无座位和endTime将插入到DB中。当你的结束时间=当前时间-on DB的字段状态为0和1. 0表示可用，1表示已预订状态更改为0。

一切都已完成，但颜色不会变回绿色。而状态已变为0。

这是我在aspx中的代码。从.html和.js也没有座位，也从座位仍然被预订的数据库中获取数据。

[WebMethod]
    [ScriptMethod(UseHttpGet = true)]
    public static string GetSeat()
    {
        string sql = "";
        SqlConnection conn = DBConnection.getConnection();
        conn.Open();
        sql = "UPDATE booking SET statusBooked = 0 WHERE CONVERT(char(5),[end], 108) = '" + DateTime.Now.ToString("hh:mm") + "'";
        SqlCommand _cdm = new SqlCommand(sql, conn);
        _cdm.ExecuteNonQuery();
        conn.Close();



        List<booking> bookList = new List<booking>();            
        conn.Open();
        sql = "Select noSeat from booking WHERE statusBooked = 1";
        SqlCommand cmd = new SqlCommand(sql, conn);
        SqlDataReader dr = cmd.ExecuteReader();            
        while (dr.Read())
        {
            booking book = new booking();
            book.noSeat = dr[0].ToString();
            book.end =(DateTime) dr[1];
            bookList.Add(book);

        }      

        conn.Close();

        JavaScriptSerializer serializer = new JavaScriptSerializer();            
        return serializer.Serialize(bookList).ToString(); 
    }

这是我在.js上的ajax，它接收哪个座位号被预订并变为红色我把setInterval放在文件准备好了。所以它会每2秒刷新一次。

setInterval('_ajax()', 2000);






function _ajax()

{

$.ajax({
    url: "Url.aspx/GetSeat",
    type: "GET",
    contentType: "application/json; charset=utf-8",

    success: function (response) {            
        var arr = JSON.parse(response.d);
        console.log(arr);
        objData = new Array();
        objData = arr;
        for (i = 0; i < objData.length; i++) {
            //console.log(objData[i].noSeat);
            jQuery('#' + objData[i].noSeat).addClass('seat-booked');
            jQuery('#class-' + objData[i].noSeat).attr('value', 'seat-booked');
            jQuery('#' + objData[i].noSeat).removeClass('seat-availiable');
            jQuery('#' + objData[i].noSeat).removeClass('selected');

        }
    },
    error: function () {
        alert("sorry, there was a problem!");
        console.log("error");
    },
    complete: function () {
        console.log("complete");
    }

});

}

它应该是自动绿色，因为我只发送从aspx和.js预订的座位数量我只改为红色如果noseat等于我从.aspx发送的数据但如果我手动重新加载Index.html。座位变为绿色。它有效，但不是自动的。我曾经使用html refres元标记，并在page_load上重新加载，但它使页面闪烁。我想让它刷新而不会闪烁。

Answer 1

为什么不在客户端控制此更改，而不是每次都将数据发送回服务器？

通过执行此操作，您可以每2秒避免大量服务器请求。

但是，如果您仍想遵循您的方法，我建议您仅在更换座位（而不是页面中的所有座位）时执行您的ajax。当您在座位中单击并设置结束时间值时，您可以调用您的ajax告诉数据库当时预订了特定的座位。

我建议您使用的其他方法是：每次在ajax通话中获得结果时，您都可以将页面中的所有席位设置为＆＃34;可用＆＃34;

(jQuery('your-common-seat-class').removeClass('seat-booked').addClass('seat-availiable');

并为您的回复数据中的每个席位设置为预订。

for (i = 0; i < objData.length; i++) {
    //console.log(objData[i].noSeat);
    jQuery('#' + objData[i].noSeat).addClass('seat-booked');
    jQuery('#class-' + objData[i].noSeat).attr('value', 'seat-booked');
}

自动刷新ASP.NET而不闪烁页面

1 个答案: