Mehrere Benutzersteuerelemente mit Javascript

Question

Ich versuche, ein einfaches Timepick-Benutzersteuerelement mit einem Kombinationsfeld und einem kleinen Bild einer Uhr zu emulieren. In der Benutzersteuerung Typ I im Code:

function SetFocus() { 
    var comboBox = $find("<%=cboTime.ClientID %>"); 
    var input = comboBox.get_inputDomElement(); 
    input.focus();  } 

cboTime die Combobox Kontrolle ist, und es ist ein Bild von einer kleinen Uhr direkt nach I diese Funktion

all das Click-Ereignis des Bildes binden ist gut und dandy, wenn ich EIN Benutzersteuerelement auf meiner Seite habe .....

Wenn ich ein anderes Benutzersteuerelement mit einem anderen Namen hinzufüge, ist das Verhalten so, dass egal welches Bild ich klicke, das allerletzte Kombinationsfeld bekommt den Fokus.

Ich weiß, was passiert ... Ich brauche nur einen Workaround. Wenn die Seite gerendert wird, erstellt sie zwei identische Skripts mit der Client-ID des Kombinationsfelds. Problem ist, dass alle vorhergehenden Instanzen den Vorgänger überschreiben, weil sie den gleichen Namen haben.

Hat jemand eine Lösung dafür? Es muss einfach sein, aber ich kann die Antwort nirgends finden.

Dank

Answer 1

Sie müssen die SetFocus() Methode ändern, so dass es die Client-ID des Combobox als Parameter übernimmt:

function SetFocus(cboClientId) { 
    var comboBox = $find(cboClientId); 
    var input = comboBox.get_inputDomElement(); 
    input.focus(); 
} 

Das bedeutet, werden Sie den Code ändern müssen, wo der Ruf der SetFocus() Methode wird gemacht. Wenn ich das richtig verstehe, geschieht dies in einem clientseitigen Click-Event-Handler für ein Bild. In diesem Fall könnten Sie den onclick="..." Teil des Bildes im Code des Steuerelements festlegen. Z.B. so etwas wie dieses (nicht getestet):

ASCX:

<asp:DropDownList id="cboTime" .../> 
<asp:Image id="img" .../> 

-Code-behind:

img.Attributes.Add("onclick", 
    string.Format("javascript:SetFocus('{0}');", cboTime.ClientID)); 

Dann können Sie die SetFocus() Methode nehmen und es in eine externe JS-Datei setzen (und umfassen das in Ihrem ASCX).