2011-02-01 73 views
1

我想首先加載一個ASP.NET頁面,然後觸發一個服務器端事件,反過來更新客戶端上的一些HTML。該事件與Anthem.NET圖像按鈕控件綁定,因此邏輯操作過程將僅僅是觸發該控件的事件。但是,如果有另一種方法來觸發此服務器端事件並將用戶控件的結果html返回給客戶端,我也會考慮它。我正在使用ASP.NET 3.5,Anthem.NET框架和JQuery 1.4.4。在ASP.NET中加載頁面時,如何激發Anthem.NET按鈕單擊事件?

我一直在這幾個小時,並通過幾個職位,似乎有一個答案已經走了,但似乎沒有這樣的伎倆 - 至少,這將在每一個瀏覽器上運行。

按鈕我試圖火:

<anthem:ImageButton runat="server" ID="btnGetRates" 
    ImageUrl="~/BVModules/Themes/BVC5/Images/Buttons/GetRates.png" 
    TextDuringCallBack="Retrieving rates..."> 
</anthem:ImageButton> 

在客戶端上呈現,看起來像這樣:

<span id="Anthem_ctl00_MainContentHolder_EstimateShippingDisplay2_btnGetRates__"> 
    <input type="image" 
     name="ctl00$MainContentHolder$EstimateShippingDisplay2$btnGetRates" 
     id="ctl00_MainContentHolder_EstimateShippingDisplay2_btnGetRates" 
     src="BVModules/Themes/Depot/images/buttons/GetRates.gif" 
     onclick="javascript:Anthem_FireCallBackEvent(this,event,'ctl00$MainContentHolder$EstimateShippingDisplay2$btnGetRates','',true,'','','Retrieving rates...',true,null,initAccordion,null,true,true);return false;WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContentHolder$EstimateShippingDisplay2$btnGetRates&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" 
     style="border-width:0px;" /> 
</span> 

方法1:

jQuery(document).ready(function() { 
    setTimeout(getRates, 5000); 
}); 

function getRates() { 
    jQuery('#ctl00_MainContentHolder_EstimateShippingDisplay2_btnGetRates').click(); 
} 

使用此方法使按鈕文本更新爲「正在檢索費率...」,但是電話永遠不會讓它到服務器,它只是無限期地掛起(在IE7中)。在Firefox中,該按鈕會在瞬間變化,然後再變回,並且對服務器的調用也不會被觸發。

有趣的是,如果getRates()函數是從一個按鈕單擊事件,而不是從(文件)。就緒()調用,將功能(在IE瀏覽器,而不是Firefox瀏覽器)。

方法2:

我遵循公認的答案中的說明Call ASP.NET function from JavaScript?,但除了沒有引起我的服務器端方法火,這種做法並沒有解決,我想輸出的事實當方法完成時,用戶控件的html顯示在客戶端上。

方法3:

jQuery(document).ready(function() { 
    setTimeout(getRates, 5000); 
}); 

function getRates() { 
    var btn = document.getElementById('ctl00_MainContentHolder_EstimateShippingDisplay2_btnGetRates'); 
    fireEvent(btn,'click'); 
} 

function fireEvent(element,event){ 
    if (document.createEventObject){ 
    var evt = document.createEventObject(); 
    return element.fireEvent('on'+event,evt) 
    } else { 
    var evt = document.createEvent("HTMLEvents"); 
    evt.initEvent(event, true, true); // event type,bubbling,cancelable 
    return !element.dispatchEvent(evt); 
    } 
} 

我發現燒事件here的這種方法。

而不是使用jQuery的方法,這可以追溯到的JavaScript的基礎知識。這種方法在IE中完美工作,但我又遇到了Firefox的問題。由於這是在一個瀏覽器中工作,我知道我必須越來越近。有趣的是,即使這從排序工作到完全在IE中工作,Firefox的行爲與第一種方法完全相同 - 該按鈕會立即改變文本「Retrieving Rates」。 ..「並且變化得很快,這只是幾乎不可知的。

另一條線索:

我挖成Anthem.NET javascript來看看如果我能找到的線索正在發生的事情。儘管我發現了一條線索,但我不確定它爲什麼會導致瀏覽器行爲的這種差異,或者更確切地說,處理這種不同行爲的代碼是什麼樣子。正如你可以通過下面的代碼看到的那樣,IE中的按鈕事件與其他瀏覽器不同。如果你想知道,是的,我正在使用驗證控件(驗證器)。

// Primarily used by Anthem.Manager to add an onsubmit event handler 
// when validators are added to a page during a callback. 
function Anthem_AddEvent(control, eventType, functionPrefix) { 
    var ev; 
    eval("ev = control." + eventType + ";"); 
    if (typeof(ev) == "function") { 
     ev = ev.toString(); 
     ev = ev.substring(ev.indexOf("{") + 1, ev.lastIndexOf("}")); 
    } 
    else { 
     ev = ""; 
    } 
    var func; 
    if (navigator.appName.toLowerCase().indexOf('explorer') > -1) { 
     func = new Function(functionPrefix + " " + ev); 
    } 
    else { 
     func = new Function("event", functionPrefix + " " + ev); 
    } 
    eval("control." + eventType + " = func;"); 
} 

我幾乎準備認輸並開始使用Web服務,讓我的用戶控件的HTML輸出,然後將其返回到jQuery的,因此它可以在客戶端上進行更換的方法工作我認爲我會檢查是否有人能夠給我提供線索,以瞭解如何讓方法#3在非IE瀏覽器中工作。

回答

0

您已經提供了您需要的答案,它位於呈現控件的onclick事件中。

onclick="javascript:Anthem_FireCallBackEvent(this,event,'ctl00$MainContentHolder$EstimateShippingDisplay2$btnGetRates','',true,'','','Retrieving rates...',true,null,initAccordion,null,true,true); 

你可以把呼叫Anthem_FireCallBackEvent你喜歡的地方,但你需要它有點像這樣收緊:

Anthem_FireCallBackEvent(document.getElementById('<%= btnGetRates.ClientID %>'),event,'<%= btnGetRates.UniqueId%>','',true,'','','Retrieving rates...',true,null,initAccordion,null,true,true); 

傳你想要的任何事件,但事件不能爲空或你會得到錯誤。

+0

哇,自從我發佈這個版本以來,已經有一段時間了,我已經構建了Web服務來提供用戶控件的HTML,事實上它已經投入生產了一段時間。我記得,使用這種方法的主要問題是當我修改按鈕時,它們不會被這個客戶端腳本自動拾取。然而,當你回答時,我會將其標記爲答案,並在下次嘗試解決方案。 – NightOwl888 2011-05-07 10:56:51

0

我有過類似的經歷。我使用了anthem計時器而不是jQuery計時器。

+1

在這裏提供一個例子會使這個更有用... – endyourif 2012-09-23 01:00:33

相關問題