JavaScript for each record in my view

Question

JavaScript for each record in my view

Navigation

#1 by (5 votes)
#2 by (-2 votes)

0

I have a VIEW where I display a table with 15 records (15 rows) and 5 columns, but the very thing that matters is a column, "Actions". In it I have a button, "View", which when clicking I want to open a window with a message, for tests .

However, only the first record, when you click the "View" button, displays the message window, the other 14 records do not.

How do I make all records / lines display the message?

Below is code:

VIEW CSHTML

<table class="table table-bordered table-hover tablesorter">
    <thead>
        <tr>
            <th class="header text-center" style="width: 100px;"> Ações </th>
        </tr>
    </thead>
    <tbody id="tabela">     
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @this.Hidden("IdClient").Value(item.Id)
                    <a id="visualizarCliente" class="btn btn-primary btn-xs btn-visualizar" data-toggle="tooltip" title="Visualizar" target="_blank" 
                      href="@Url.Action(MVC.Painel.Clientes.Visualizar(item.Id))">
                        <i class="fa fa-eye"></i>
                    </a>
                </td>
            </tr>
        }
    </tbody>
</table>

JavaScript

<script type="text/javascript">
    $(function () {
        $("#visualizarCliente").click(function () {
            var idCliente = $("#IdClient").val();
            window.alert("Teste");
        })
    });
</script>

javascript html5 asp.net-mvc-4

asked by anonymous 24.01.2017 / 17:53

2 answers

-2

The ideal in this case would be to use a modal. and pass the value of each id to the modal would look good but more practical. it would find the id and show certain functions of each Id.

24.01.2017 / 18:00

Have PHP read the server folders [duplicate] Problems displaying my site in chrome

score 5 · Accepted Answer

The problem is that you are using the id selector and it can not be repeated. Switch to any other selector, such as data-toggle="tooltip" for example.

<script type="text/javascript">
    $(function () {
        $("a[data-toggle='tooltip']").click(function () {
            window.alert("Teste");
        })
    });
</script>