Question

我正在使用jqxgrid并且我有以下代码片段，我想在按钮单击上显示加载指示器，它调用Ajax方法并将其隐藏在成功方法上或者无论如何其他显示它，因为我需要显示加载指示器时间要求，直到我得到数据

      $("#btnSearch").bind('click', function () {

     //show indicator here
     LoadLookUpSearchGrid();
    }


    //Ajax call to fetch data
    function LoadLookUpSearchGrid() {
                 var filterRows = getGridRows();
                 $.ajax({
                 type: 'POST',
                 dataType: 'json',
                 async: false,
                 cache: false,
                 url: 'AddEditView.aspx/LoadLookUpSearchGrid',
                 data: JSON.stringify({ FilterType: $('select#ddlFilterType').val() , Id: $("#txtId").val() , Name: $("#txtName").val(), SearchText: '', FilterRows: filterGridRows}),
                 contentType: 'application/json; charset=utf-8',
                 success: function (data) {

                    var source = data.d;
               SetSearchFields($('select#ddlFilterType option:selected').text(), source);

                 },
                 error: function (err) {
                     alert(err.text + " : " + err.status);
                 }
                 });
             };

//源对象格式化数据 function SetSearchFields（fieldName，source）{

                  var columns;

                 if (fieldName == "Operating Company") {

                          source =
                            {
                                datatype: "xml",
                                datafields: [
                                    { name: 'COMPANY', type: 'string' },
                                    { name: 'DESCR', type: 'string' }
                                    ],
                                async: false,
                                root: "Company",
                                localdata: source
                            };
                     columns = [
                           { text: 'OPCO ID', dataField: 'COMPANY', width: '30%' },
                           { text: 'Company Name', dataField: 'DESCR', width: '65%' }
                               ];

                 }

     lookupSearchResultGrid(source, columns,fieldName);
    }

//adaptor to fill source and bind grid
    function lookupSearchResultGrid(source, columns,fieldName) {

                 var searchViewGridDataAdapter = new $.jqx.dataAdapter(source);

                 $("#divLookupSearch").jqxGrid(
                        {
                            width: '100%',
                            source: searchViewGridDataAdapter,
                        theme: theme,
                        sortable: true,
                        pageable: true,
                        autoheight: true,
                        selectionmode: 'checkbox',
                        columns: columns
                    });
//hide indicator here on on success method of ajax call

         };

Answer 1

单击按钮调用showloadelement并在Ajax调用成功回调函数中调用hideloadelement。

     $("#btnSearch").bind('click', function () {
        $('#divLookupSearch').jqxGrid('showloadelement');
        //show indicator here
        LoadLookUpSearchGrid();
        }
       ...
        success: function (data) {
            $('#jqxGrid').jqxGrid('hideloadelement');
            var source = data.d;
            SetSearchFields($('select#ddlFilterType option:selected').text(), source);

        },
       ...

最诚挚的问候，

Alpesh

jqxgrid不显示忙或加载指示符

1 个答案: