刷新和清除按钮在asp.net应用程序上不起作用

时间:2019-10-25 07:10:07

标签: javascript html sql-server knockout.js

我的“清除”和“刷新”按钮没有清除我在网页上的分支和终端输入。我认为这与我的KnockoutJS有关,因为我将数据绑定到数据库中的表。也许KnockoutJS不能正常运行。该页面应该在每次单击“刷新”按钮时显示从数据库中获取的数据。但是似乎代码甚至都没有从数据库中获取任何东西。 我刚开始学习asp.net的框架,所以有人可以帮助我解决我的问题吗? T

我尝试查看其他API函数,但只调整了一些参数以从数据库中获取数据,因为需要从中获取不同的表。我还针对API函数修改了相应页面的存储过程,以从SQL Server中获取数据,但该页面仍然显示为空白,并且按钮不起作用。

按钮html

 <div class="col-sm-5 col-md-5 col-lg-5 m-b-15">
                            <button id="btnRefreshForecastDetails" type="button" class="btn btn-primary btn-custom w-md waves-effect waves-light" data-bind="click: refresh"><i class="mdi mdi-refresh"></i> <span>Refresh</span></button>
                            <button id="btnClearAll" type="button" class="btn btn-primary btn-custom w-md waves-effect waves-light" onclick="ClearAll();"><i class="mdi mdi-close"></i> <span>Clear All</span></button>

                        </div>   

.JS函数

    var ObservableModelMain = function () {
var self = this;
self.gifts = ko.observableArray();

self.refresh = function () {
    StartLoadingPage();
    url = sessionStorage.getItem('WebApiURL') + "IT_GetDetails?ID=" + sessionStorage.getItem('ID');
    var table = $('#main-table');//table from DB
    var PageSize = sessionStorage.getItem('PageSize');
    var valueToPush = {};
    var FinalData = [];
    valueToPush.PageNumber = table.getPageNum();
    valueToPush.PageSize = PageSize;
    valueToPush.SortExpression = table.getSortExpression();
    valueToPush.SortOrder = table.getSortOrder();
    valueToPush.SearchBranchNo = _strSearchBranchNo;
    valueToPush.SearchTerminalNo = _strSearchTerminalNo;
    valueToPush.SearchDate = _strSearchDate;
    FinalData.push(valueToPush);
    valueToPush = {};
    var myJSON = JSON.stringify(FinalData)

    $.ajax({
        url: url,
        type: "POST",
        data: myJSON,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            DeviceStatus = data["errorCode"];
            Param = data["param"];
            if (DeviceStatus == 'SUCCESS') {
                var obj = JSON.parse(Param);

                if (obj[0].length == 0 && obj[1][0].TotalOutput != 0) {
                    document.getElementById('btnRefreshForecastDetails').click();
                }
                else {
                    self.gifts(obj[0]);
                }

                table.updateTable(parseInt(PageSize), obj[1][0].TotalOutput);
                //GetBranchList();
            }
            else {
                swal("Error", "Fail to retrieve forecast details, " + Param, "error");
            }

            CloseLoadingPage();
        }
    });
}
    };

API函数

    public async Task<TCR_RESPONSEMESSAGE> IT_GetForecastDetails(ITForecast[] Alldata)
    {
        StringBuilder sbReturnMessage = new StringBuilder();
        StringBuilder sbTraceMessage = new StringBuilder();
        API_COMPLETEMESSAGE tcm = null;
        WebAPITraceLog wtl = null;
        string reqStr = string.Empty;
        string repStr = string.Empty;
        string MessageSeqNo = string.Empty;
        const string functionNameStr = nameof(IT_GetForecastDetails);
        API_FUNCTION APIFunctionCode = API_FUNCTION.IT_GetForecastDetails;

        StringBuilder sbSQLStmt = new StringBuilder();
        bool asyncResult = false;
        DataSet dsData = new DataSet();
        bool blnResult = false;
        string strTable = "tblForecastDetails";
        List<SqlParameter> SqlParameters = new List<SqlParameter>();
        try
        {
            using (SqlConnection SQLDBConn = new SqlConnection(sqlTCRSecureBODBConnStr))
            {
                await SQLDBConn.OpenAsync();

                SqlParameters.Add(new SqlParameter("@PageNumber", Alldata[0].PageNumber));
                SqlParameters.Add(new SqlParameter("@PageSize", Alldata[0].PageSize));
                SqlParameters.Add(new SqlParameter("@SortExpression", Alldata[0].SortExpression));
                SqlParameters.Add(new SqlParameter("@SortOrder", Alldata[0].SortOrder));

                SqlParameter OutputParam = new SqlParameter("@TotalRecords", SqlDbType.BigInt);
                OutputParam.Direction = ParameterDirection.Output;
                SqlParameters.Add(OutputParam);

                blnResult = ReadDataSetByStoredProcedure("GetForecastDetailsWithPage", SqlParameters, strTable, DEFAULT_LOG_NAME, SQLDBConn, ref dsData);

                if (blnResult == false)
                {
                    tcm = FAIL_READ_MESSAGE;
                    tcm.Param = "Fail to read GetForecastDetailsWithPage.";
                    goto ExitHandler;
                }

                DataTable tbl = new DataTable("tblPagerInfo");

                tbl.Columns.Add("TotalOutput", typeof(long));

                tbl.Rows.Add(Convert.ToInt64(SqlParameters[4].Value));

                dsData.Tables.Add(tbl);
            }

            if (dsData != null)
            {
                tcm = SUCCESS_MESSAGE;
                tcm.Param = JsonConvert.SerializeObject(dsData.Tables);
                goto ExitHandler;
            }
            else
            {
                tcm = FAIL_READ_MESSAGE;
                tcm.Param = "Fail to read GetForecastDetailsWithPage.";
                goto ExitHandler;
            }

            ExitHandler:
            tcm.Function = APIFunctionCode;
            return await ProcessAPICompleteMessage(tcm, functionNameStr);
        }
        catch (Exception ex)
        {
            string errorMessages = string.Empty;
            errorMessages += "Description : " + ex.Message;
            LogError(DEFAULT_LOG_PATH, DEFAULT_LOG_NAME, errorMessages, GetLineNumber(ex).ToString(), functionNameStr);
            tcm = EXCEPTION_MESSAGE;
            tcm.Function = APIFunctionCode;
            tcm.Param = errorMessages;
            return await ProcessAPICompleteMessage(tcm, functionNameStr);
        }
    }

我希望“刷新”和“清除”按钮能够正常工作,并且希望从声明的表中提取DB数据以显示在网页上。

1 个答案:

答案 0 :(得分:0)

好吧,对于初学者来说,我看不到任何与您的视图模型绑定的敲除项,最好是在您的视图模型定义之下。

ko.applyBindings(new ObservableModelMain());

其次,您的清除按钮具有简单的旧JavaScript onclick事件属性,而不是在剔除视图模型中的数据绑定到-也同样不可用的self.clear = function() {...}