更新面板进度条onclientclick事件

Question

我有一个更新进度栏，它适用于OnClick事件（服务器端），但我需要更新OnClientClick事件的进度栏（客户端）。

我尝试了以下解决方案，但对我不起作用。

Js:

function ComparableSearch() { 
   $get('UpdateProgress1').style.display = 'block';    
    window.scrollTo(0, 0);
   
    GetRefineSearchDetailsMap(StreetNo[0], StreetNo[1], StreetName, State, County, ZipCodeFrom, ZipCodeTo, SalePriceFrom,
                               SalePriceTo, LivingArea, LivingAreaTo, SaleDateFrom, SaleDateTo, SubjectPropertyId, Section, Subdivision,
                               LotSizeFrom, LotSizeTo, YearBuiltFrom, YearBuiltTo, Stories, PrivatePool, FirePlace, Disclosure, IsListing,
                               City, Design, FirePlaceTo);
  
    $("#map").show();
    $("#MainSearchResult").hide();
    return false;
   $get('UpdateProgress1').style.display = 'none';
}

function GetRefineSearchDetailsMap(aStreetNoFrom, aStreetNoTo, aStreetName, aState, aCounty, aZipCodeFrom, aZipCodeTo, aSalePriceFrom,
                                    aSalePriceTo, aLivingArea, aLivingAreaTo, aSaleDateFrom, aSaleDateTo, aSubjectPropertyId, aSection, aSubdivision, aLotSizeFrom,
                                    aLotSizeTo, aYearBuiltFrom, aYearBuiltTo, aStories, aPrivatePool, aFirePlace, aDisclosure, aIsListing, aCity, aDesign, aFirePlaceTo) {

    var SalesSearchCriteria = {        
        X1: X1,
        X2: X2,
        Y1: Y1,
        Y2: Y
    };
    request = $.ajax({
        url: "Form1004/SaleComparableHandler.ashx?type=GetRefineSearchDetailsMap&Tid=" + Math.random(),
        type: "POST",
        data: { "SearchCriteria": JSON.stringify(SalesSearchCriteria) },
        async: true,
        success: function (data) {
            if (data.length > 0) {
                if (data != "Error") {
                    
                }
                else {                    
                    alert("Your session has been expired");
                }
            }
            else {               
                alert("No data exists");
            }
        },
        error: function (XMLHttpRequest, status, errorThrown) {
            if (errorThrown != 'abort') {
                PopUpAlertBox("Please try again...<br/><br/>Below error occured <br/><br/> " + errorThrown + "");
            }
            else {
                PopUpAlertBox("Error : " + errorThrown + "");
            }           
        }
    });
    return false;
}

Answer 1

如果我没有弄错，Ajax就是您所需要的。

我应该在客户端创建脚本，将数据传递给服务器（当事件Click为true时），服务器的结果是进度条的数据。

此处的小示例

Answer 2

您可以使用它在javascript 上显示UpdateProgress控件

$get('UpdateProgress1').style.display = 'block'; 

类似的东西隐藏它

$get('UpdateProgress1').style.display = 'none';

编辑

// display indicator before ajax starts
$get('UpdateProgress1').style.display = 'none';
$.ajax({
    url: "Form1004/SaleComparableHandler.ashx?type=GetRefineSearchDetailsMap&Tid=" + Math.random(),
    type: "POST",
    data: { "SearchCriteria": JSON.stringify(SalesSearchCriteria) },
    success: function (data) {
       // your code
    },
    error: function (XMLHttpRequest, status, errorThrown) {
       // your code
    }
})
.always(function() {
    // hide ajax indicator when ajax finished (success or error)
    $get('UpdateProgress1').style.display = 'none';
});