Définition d'un bouton radio lorsqu'un utilisateur clique sur « input type = » file »

Question

Ma forme ressemble à quelque chose comme ceci:

[ radio ] Use your current picture 
[ radio ] Use the sites default 

SELECT THIS ONE DYNAMICALLY --> [ radio ] Upload a picture from your computer 
---------------- [BrowseButton] 

Le seul problème est que lorsqu'un utilisateur clique sur soit le champ de saisie lui-même ("----"), ou le bouton Parcourir, le bouton radio correspondant ne devient pas sélectionné (ce qui est attendu) .J'essaie d'attacher des événements Javascript sur le terrain, mais rien ne semble fonctionner ..

Je ne sais pas si cela compte vraiment, mais le backend est .NET et c'est le code qui est utilisé pour générer le champ:

<li> 
    <asp:RadioButton ID="rbUpload" GroupName="avatar" runat="server" Text="Upload a new picture from your computer" /> 
    <asp:FileUpload ID="fileUpload" runat="server" /> Maximum file size: 4 MB. 
    <asp:PlaceHolder ID="FileUploadMessages" runat="server"> 
</li> 

qui recrache le code HTML suivant:

<li> 
    <input type="radio" value="rbUpload" name="ctl00$ContentPlaceHolder$avatar" id="ctl00_ContentPlaceHolder_rbUpload"><label for="ctl00_ContentPlaceHolder_rbUpload">Upload a new picture from your computer</label> 
    <input type="file" id="ctl00_ContentPlaceHolder_fileUpload" name="ctl00$ContentPlaceHolder$fileUpload"> Maximum file size: 4 MB. 
</li> 

Je suis conscient que ces types de champs sont « en lecture seule », mais cela ne devrait pas être un problème ici ... droit? J'ai essayé d'attacher des événements jQuery tels que .click, mais ils ne semblent pas fonctionner. Voir ici:

$("#ctl00_ContentPlaceHolder_fileUpload").click(function() { 
    $("#ctl00_ContentPlaceHolder_rbUpload").click(); // sets radio 
}) 

Des idées?

Answer 1

Utilisez l'événement change, comme ceci:

$("#ctl00_ContentPlaceHolder_fileUpload").change(function() { 
    $("#ctl00_ContentPlaceHolder_rbUpload").click(); // sets radio 
})