Relation entre la zone de texte et l'image

Question

Hey, Question facile pour les profenssionals ASP.NET: J'ai quelques boîtes de texte générées dynamiquement dans une rangée. Dans cette rangée est également une image avec un eventhandler "onclick". Je vais créer une relation entre la zone de texte et l'image. Je clique sur l'image, choisis une valeur puis la zone de texte sera remplie.

Actuellement mes commandes ont généré suit dynamique ID de:

Button:

ct100_cph_Detail_rpFields_ct109_rpCell_ct100_cbf_bed1_item_sym 

Textbox

ct100_cph_Detail_rpFields_ct109_rpCell_ct100_tb_bed1 

Ces deux contrôles doivent être dans une relation. La meilleure solution pour moi est avec JavaScript, car je n'ai pas beaucoup de compétences ASP.NET ..

Merci pour votre aide! :-)

Answer 1

Si les ID générés suivent toujours ce schéma, vous pouvez accéder à la zone de texte en obtenant l'ID du bouton/image et remplacer la partie non unique de cet ID (_cbf_bed1_item_sym) par la partie non unique de la zone de texte-ID (_tb_bed1)

Exemple:

<input type="button" value="click" 
    id="ct100_cph_Detail_rpFields_ct109_rpCell_ct100_cbf_bed1_item_sym" 
    onclick="document.getElementById(this.id.replace(/_cbf_bed1_item_sym$/,'_tb_bed1')).value='gotcha'"/> 

<input type="text" 
    id="ct100_cph_Detail_rpFields_ct109_rpCell_ct100_tb_bed1"/> 

Il peut y avoir d'autres moyens, mais de dire quoi que ce soit à leur sujet, vous devez montrer le balisage d'une telle ligne (nécessaire pour voir ce qui est la relation de ces éléments concernant leur position dans l'arbre-document)

Answer 2

La "relation" est le fait qu'ils sont tous deux sur la même ligne.

Serverside:

TableRow.Attributes.Add("onclick", "rowClick(event);") 

ClientSide:

function rowClick(e) { 
    e = e || event; 
    var target, img, textbox, row; 
    target = e.target || e.srcElement; 
    if (target.tagName == 'IMG') { 
     img = target; 
     while(target.tagName != 'TR') { 
      target = target.parentNode; 
     } 
     row = target; 
     textbox = row.getElementsByTagName('input')[0]; 
     textbox.value = img.src; 
    } 
}