通过使用WebMethod返回带有消息的警报框

时间:2019-04-08 06:35:07

标签: c# jquery asp.net datepicker webmethod

我想在日期时间选择器上显示一个警告消息框,当所选日期与数据库日期匹配时

即使WebMethod运行良好,但现在我的代码是每次选择时,警告消息总是不经检查而发出。

Test.aspx.cs

    [System.Web.Services.WebMethod]
     public static string GetDateFromDB(DateTime compareDate)  
    {
        string selectedDate = compareDate.ToString("yyyy/MM/dd");

        SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["LoginDBConnectionString1"].ConnectionString);
        SqlCommand com = new SqlCommand("SELECT * from Holiday where Date='" + selectedDate + "'", conn);
        SqlDataAdapter sqlDa = new SqlDataAdapter(com);
        DataTable dt = new DataTable();
        sqlDa.Fill(dt);

        if (dt == null || dt.Rows.Count == 0)
             return "NG";               
        else
            return "OK";
    }

Test.aspx

      <link href="http://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
                <input type='text' class='date' id="datepicker" autocomplete="off">
                <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
                <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
                <script>
                    jQuery(function ($) {

                        $("#datepicker").datepicker({
                            onSelect: function (dateText) {                                    
                                alert("Selected date: " + dateText + "; input's current value: " + this.value);
                                $(this).change();
                                $.ajax({
                                    type: "POST",
                                    url: "Test.aspx/GetDateFromDB",
                                    data: '{ "compareDate" : "' + dateText + '"}',
                                    contentType: "application/json; charset=utf-8",
                                    dataType: "json",
                                    //success: OnSuccess,
                                    //failure: function (response) {
                                    //    alert(response.d);
                                    //}
                                });
                            },
                          }
                        ).on("change", function () {
                            display("Got change event from field");
                        });

                    function display(msg) {
                        $("<p>").html(msg).appendTo(document.body);
                    }

                    });
                </script>

1 个答案:

答案 0 :(得分:1)

它总是发出警报,因为警报消息已进入onChange事件。 您需要将其移至AJAX调用成功时。  下面是您的代码。

编辑:根据后面代码中的返回值检查条件(即“ OK”和“ NG”)。

 <link href="http://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
                <input type='text' class='date' id="datepicker" autocomplete="off">
                <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
                <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
                <script>
                    jQuery(function ($) {

                        $("#datepicker").datepicker({
                            onSelect: function (dateText) {                                    
                                $(this).change();
                                $.ajax({
                                    type: "POST",
                                    url: "Test.aspx/GetDateFromDB",
                                    data: '{ "compareDate" : "' + dateText + '"}',
                                    contentType: "application/json; charset=utf-8",
                                    dataType: "json",
                                    success: function(data)
                                             {
                                                 if(data == "OK")
                                                 {
                                                     alert("Selected date: " + dateText + "; input's current value: " + this.value);
                                                 }                                              
                                             },
                                    //failure: function (response) {
                                    //    alert(response.d);
                                    //}
                                });
                            },
                          }
                        ).on("change", function () {
                            display("Got change event from field");
                        });

                    function display(msg) {
                        $("<p>").html(msg).appendTo(document.body);
                    }

                    });
                </script>

注意:以上更改未经测试。如果不起作用,请写评论。