Reply To: Blazor Table Selection

[svetoslav_borislavov]

Hi,

Here is an example of getting selected values:
@using System.Text.Json;

<Button OnClick=”GetSelected”>Get Selected</Button>

<Table @ref=”tableRef” OnReady=”OnTableReady” Selection=”true”>
<table>
<thead>
<tr>
<th scope=”col”>Country</th>
<th scope=”col”>Area</th>
<th scope=”col”>Population_Rural</th>
<th scope=”col”>Population_Total</th>
<th scope=”col”>GDP_Total</th>
</tr>
</thead>
<tbody>
<tr>
<td>Brazil</td>
<td>8515767</td>
<td>0.15</td>
<td>205809000</td>
<td>2353025</td>
</tr>
<tr>
<td>China</td>
<td>9388211</td>
<td>0.46</td>
<td>1375530000</td>
<td>10380380</td>
</tr>
<tr>
<td>France</td>
<td>675417</td>
<td>0.21</td>
<td>64529000</td>
<td>2846889</td>
</tr>
<tr>
<td>Germany</td>
<td>357021</td>
<td>0.25</td>
<td>81459000</td>
<td>3859547</td>
</tr>
<tr>
<td>India</td>
<td>3287590</td>
<td>0.68</td>
<td>1286260000</td>
<td>2047811</td>
</tr>
<tr>
<td>Italy</td>
<td>301230</td>
<td>0.31</td>
<td>60676361</td>
<td>2147952</td>
</tr>
<tr>
<td>Japan</td>
<td>377835</td>
<td>0.07</td>
<td>126920000</td>
<td>4616335</td>
</tr>
<tr>
<td>Russia</td>
<td>17098242</td>
<td>0.26</td>
<td>146544710</td>
<td>1857461</td>
</tr>
<tr>
<td>United States</td>
<td>9147420</td>
<td>0.19</td>
<td>323097000</td>
<td>17418925</td>
</tr>
<tr>
<td>United Kingdom</td>
<td>244820</td>
<td>0.18</td>
<td>65097000</td>
<td>2945146</td>
</tr>
</tbody>
</table>
</Table>
@code {
Table tableRef = default!;

private void OnTableReady(Table table)
{
table.Select(1);
table.Select(2);
table.Select(5);
}

private async void GetSelected()
{
var selected = tableRef.Selected;

foreach (object item in selected)
{
if (item is string id)
{
var area = await tableRef.GetValue(id, “Area”);
var country = await tableRef.GetValue(id, “Country”);
}
}
}
}

I hope this helps!

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/