web-dev-qa-db-ja.com

C# - Blazor @onlick HTML要素をクリックする方法

私は現在C#Blazorフレームワークを学んでいます、そして私は質問に直面しています、私がクリックしたHTML要素を取得する方法?

DOMと親HTML要素内の位置を取得するには必要です。

たとえば、jQueryとの古典的な方法:

$('selector').click(function (event) {
    alert($(this).index());
});
 _

http://jsfiddle.net/bctah/

たとえば、Blazorに@onclick属性があることを知っています。

<tr @onclick="OnYes">...</tr>

@functions {
    ElementReference inputTypeFileElement;

    public async Task MainTableOnClick(MouseEventArgs e)
    {
        Console.WriteLine("clicked!");
    }
}
 _

クリックされたTR HTML要素のインデックスを取得できますか?

マイタスクはWindowsフォームのアプリケーションをWebバージョンに変換します。古いWindowsフォームにはDataGridViewがあり、その各行にOnClickイベントとタグオブジェクトもあります。 DataGridViewの行の一部をクリックすると、onclick onclick getのタグオブジェクトが行のタグオブジェクトを付けて、フォーム上の別のDataGridViewにデータを入力するように使用しました。したがって、私は知っておく必要があります。どのような行をクリックしてデータを取得するためにクリックしました(データベース可能、またはより簡単に配列にすることができます)。配列内の行とインデックスのインデックスに基づいて、Webページ上の別のテーブルを埋めるためのデータを取得する必要があります。

そのため、最初のテーブルはクライアント(名前、姓など)です。

クライアントを含む一部の行をクリックすると、表に行(クライアント)インデックスを取得する必要があります。その索引によって私はクライアントの配列からデータを取得します。見つかったクライアントオブジェクトは、ページ上の別のテーブルを動的に埋める予定です。

4
Arthur

この場合、あなたは jsInterop を使用することができます

または

<tr @onclick="() => TrClickedAtIndex(0)">...</tr>

@code {
    ElementReference inputTypeFileElement;

    public void TrClickedAtIndex(int index)
    {
        Console.WriteLine($"tr clicked at index {index}!");
    }
}

 _
6
agua from mars