onClick der Tabelle Zelle wählt Radio-Button in der Zelle

Question

Ich habe 14 Reihen von 5 td-Zellen. In jedem ist ein Radio-Button. Ich möchte, dass der Benutzer in der Lage ist, auf eine beliebige Stelle in der Tabellenzelle zu klicken, um sein Optionsfeld auszuwählen. Jede Zeile wird so erstellt:

   @for (int i01 = 1; i01 <= 5; i01++) { 
       <td id="tablecellradiobutton" onMouseover="this.bgColor='88,150,183'" onMouseout="this.bgColor='white'" onclick="@('Q01' + i01).checked = true"> 
        @Html.RadioButton("Q01", i01, Q01 == i01.ToString(), new { id = "Q01" + i01 }) 
       </td> 
       } 

jedoch mein onClick wird umfallen, mir den Fehler geben:

Dies sollte wirklich verdammt einfach sein, ohne JavaScript zu tun (oder jQuery) Funktion , aber ich denke, dass ich mich damit begnade, einen zu brauchen. Aber könnte mir jemand helfen, meinen Code zu korrigieren?

Answer 1

Ich kann Ihren vorhandenen Code nicht korrekt, aber Sie werden mehrere Instanzen von thesame id haben:

<td id="tablecellradiobutton"... 

Sie müssen für jeden einzelnen td-IDs erstellen - wahrscheinlich die tr und td Indexnummer anhängen Zu der bestehenden ID wäre das gehen.

Ich würde jQuery verwenden und find() die Eingabe innerhalb der td, die geklickt wurde, und setzen Sie die Eigenschaft checked auf true. Beachten Sie die Verwendung von document.on ..., die es ermöglicht, dynamisch hinzuzufügende Inhalte sowie statische Inhalte zu berücksichtigen. Vergiss das $ (Dokument) .ready ... wenn du es noch nicht hast.

$(document).on('click','td',function(){ 
    $(this).find('input [type="radio"]').prop('checked',true) 
    });