Добавление кнопки сведений в динамический список HTML

У меня есть список HTML, который генерируется динамически с использованием фильтрованных данных.

<tbody>
            @{
                foreach (var item in listado.Where(x => x.Raw != null)) {
                    <tr>
                        <td>@item.Id</td>
                        <td>@item.Usuario</td>
                        <td>@item.NIF_CIF</td>
                        <td>
                            @if (!(String.IsNullOrEmpty(item.Telefono)) && !(String.IsNullOrWhiteSpace(item.Telefono))) {
                                @item.Telefono
                            } else {
                                @Html.Raw("No disponible")}
                        </td>
                        <td>@Math.Round(item.PrecioTotal)&nbsp;&euro;</td>
                        <td>@item.FechaCreacion.ToShortDateString()</td>
                        <td>
                            <button id="detalles@(item.Id)">Detalles</button>
                        </td>
                    </tr>
                    <tr id="vistaDetalles@(item.Id)" hidden>
                        <td>Detalles del presupuesto</td>
                    </tr>
                }
            }
        </tbody>

Я попытался пометить кнопку, как вы можете видеть, используя item.Id, а затем указать на нее в этом скрипте:

<script>
$("document").ready(function (Id) {
    $("#detalles"+ Id).click(function (Id) {
        $("#vistaDetalles" + Id).show();
    });
});</script>

Я также попытался не пометить их и поймать все кнопки (удаление части + Id) и ту же технику, чтобы поймать все скрытые tds, но ничего не работает. Что я делаю не так? Кроме того, можете ли вы порекомендовать какой-либо учебный материал, чтобы я мог получить эту часть немного яснее? Заранее спасибо. С уважением.

javascript,c#,jquery,html,

1

Ответов: 3


0 принят

Вы можете использовать атрибуты данных для этой цели

HTML

<button class="detalles" data-itemid="@item.Id">Detalles</button>

JQuery

$(".detalles").on("click",function(){
   var itemId = $(this).data('itemid');
   $('#vistaDetalles'+itemId).show();
});

1

Я бы заменил вашу кнопку

<button onclick="detalles(@item.Id)">Detalles</button>

И измените свой JavaScript на:

<script>
    function detalles(Id) {
        $("#vistaDetalles" + Id).show();
    };
</script>

-1

Попробуй:-

<script>
$("document").ready(function (Id) {
    $("body").on("click","#detalles"+ Id, function (Id) {
        $("#vistaDetalles" + Id).show();
    });
});</script>
JavaScript, C #, JQuery, HTML,
Похожие вопросы