Take TD value and send as parameter

Asked

Viewed 846 times

3

I have a table with two TD only (CNPJ and Social Reason). My controller has a method that takes 2 parameters (CNPJ or Reason). These parameters are sent via jquery. I am unable to do the following. By clicking on TD CNPJ or Razao, you should submit the amount of TD in question. See how my code is, after 1 million attempts.

$('#tblPesquisa').on('click', 'td', function (e) {
            var ancora = $(this).find('label a');
            var valor = ancora.text();

            alert(teste);
        });

It doesn’t even enter Alert. The whole code looks like this. My html is dynamic, that is, it is mounted in the success of ajax.

function DetalhesEvento() {

var str = "";
var obj = {};

$('body').on('click', ' #tblPesquisa td', function (e) {
    var ancora = $(this).find('label a');
    var valor = ancora.text();
    alert(valor);
});

$.ajax({

    url: '/GerenciarPDV/DetalhesEvento',
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    type: "POST",
    data: JSON.stringify({ _cnpj: _cnpjrazao }),
    success: function (data) {

        alert();

        str += '<div class="container col-xs-4  table-overflow" id="tabela">';
        str += '<table class="table table-striped table-ordered table-bordered" id="tblPesquisa">';
        str += '<thead>';
        str += '<tr>';
        str += '<td><strong>CNPJ</strong></td>';
        str += '<td><strong>Razão Social</strong></td>';
        str += '</tr>';
        str += '</thead>';
        str += '<tbody>';

        $(data.detalheEvento).each(function () { 

            str += '<tr>';// onclick="DetalhesEvento(this)"
            str += '<td><a href="DetalhesEvento(this)"><small>' + this.CNPJ + '</small></a></td>';
            str += '<td><a href="DetalhesEvento(this)"><small>' + this.RazaoSocial + '</small></a></td>';
            str += '</tr>';
        })
        str += '</tbody>';
        str += '</table>';
        str += '</div>';

        str += '<div class="pull-left">';
        str += '<div >';
        str += '<label><b>Situação:</b></label>';

        switch(data.detalheEvento[0].IS_Ativo){
            case true:
                str += '<label>  Ativo  </label>';
                break;
            case false:
                str += '<label>  Inativo  </label>';
                break;
        }
        str += '<label><b>Status:</b></label>';
        switch (data.detalheEvento[0].IT_Status) {
            case 1:
                str += '<label> OK</label>';
                break;
            case 2:
                str += '<label> Alerta</label>';
                break;
            case 3:
                str += '<label> Erro</label>';
                break;
        }
        str += '</div>';

        str += '<div>';
        str += '<label><b>Razão Social:</b></label>';
        str += '<label>' + data.detalheEvento[0].RazaoSocial + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Nome de Fantasia:</b></label>';
        str += '<label>' + data.detalheEvento[0].NomeFantasia + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>CNPJ:</b></label>';
        str += '<label>' + data.detalheEvento[0].CNPJ  + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Endereço:</b></label>';
        str += '<label>' +  data.detalheEvento[0].Endereco + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Número:</b></label>';
        str += '<label>' + data.detalheEvento[0].Numero  + '</label>';
        str += '<label><b>Complemento:</b></label>';
        str += '<label>' +  data.detalheEvento[0].Complemento + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Bairro:</b></label>';
        str += '<label>' +  data.detalheEvento[0].Bairro + '</label>';
        str += '<label><b>CEP:</b></label>';
        str += '<label>' + data.detalheEvento[0].CEP  + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Cidade:</b></label>';
        str += '<label>' + data.detalheEvento[0].Cidade  + '</label>';
        str += '<label><b>Estado:</b></label>';
        str += '<label>' + data.detalheEvento[0].Estado  + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Telefone Fixo:</b></label>';
        str += '<label>' + data.detalheEvento[0].Telefone  + '</label>';
        str += '<label><b>Celular:</b></label>';
        str += '<label>' +  data.detalheEvento[0].Celular + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Tipo:</b></label>';
        str += '<label>' + data.detalheEvento[0].tipo + '</label>';
        str += '<label><b>Qtde Checkouts:</b></label>';
        if (data.result_dim[0].Checkout > 0) {
            str += '<label>' + data.result_dim[0].Checkout + '</label>';
        } else {
            str += '<label>Não há informação</label>'
        }
        str += '</div>';

        str += '<div>';
        str += '<label><b>Tipo da Rede:</b></label>';
        str += '<label>' +  data.detalheEvento[0].Nome + '</label>';
        str += '<label><b>Nome da Rede:</b></label>';
        str += '<label>' +  data.detalheEvento[0].NomeRede + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Contato:</b></label>';
        str += '<label>' + data.detalheEvento[0].contato + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<label><b>Tel. Contato:</b></label>';
        str += '<label>' + data.detalheEvento[0].tel_contato + '</label>';
        str += '<label><b>Cel. Contato:</b></label>';
        str += '<label>' + data.detalheEvento[0].cel_contato  + '</label>';
        str += '</div>';

        str += '<div>';
        str += '<div>';
        str += '<div class="pull-right">';
        //str += '<div>';
        str += '<button type="button" class="btn btn-danger">Inativar</button>';
        str += '<button type="button" class="btn btn-primary">Add</button>';
        str += '</div>';
        str += '</div>';
        str += '</div>';


        str += '<div class="pull-right" id="tabela4">';
        str += '<br />';
        str += '<table class="table table-striped table-ordered table-bordered col-md-4">';
        str += '<thead>';
        str += '<tr>';
        str += '<td><strong>ID Evento</strong></td>';
        str += '<td><strong>Tipo</strong></td>';
        str += '<td><strong>Usuário</strong></td>';
        str += '<td><strong>Data de Inclusão</strong></td>';
        str += '<td></td>';
        str += '</tr>';
        str += '</thead>';

        str += '<tbody>';

        $(data.result_evento).each(function () {

            //var data_evento = getFormattedDate(data.result_evento);

            str += '<tr>';
            str += '<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>' + this.ID_CRM_Evento + '</small></td>';
            str += '<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>' + this.ID_TipoEvento  + '</small></td>';
            str += '<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>' + this.DE_Usuario  + '</small></td>';
            str += '<td class="col-xs-4 col-sm-4 col-md-4 col-lg-4"><small>' + getFormattedDate(this.DT_Inclusao) + '</small></td>';
            str += '<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><button type="button" class="btn btn-primary">Abrir</button></td>';
            str += '</tr>';
        });
        str += '</tbody>';
        str += '</table>';
        str += '</div>';

        str += '</div>';
        str += '</form>';
        str += '</div>';

        $('#montaPesquisaGrid').html(str);
        str = "";

    },
    error: function (error) {

    }

});

}

My cshtml as is. It has 4 tabs and this is the tab 1.

@model List<V99SuporteTecnico.Models.T_PDV>

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html lang="pt-BR" class="no-js">
<!--<![endif]-->
<head>
    <meta name="viewport" content="width=device-width" />
    <title>GerenciarPDV</title>

    @*<!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <!-- Optional theme -->
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
    <!-- Latest compiled and minified JavaScript -->
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    <link href="~/Content/bootstrap.min.css" rel="stylesheet">

    <link rel="stylesheet" href="~/Content/bootstrap.min.css" media="screen"/>
    <script type="text/javascript" src="~/Scripts/bootstrap.js"></script>
    <script type="text/javascript" src="~/Scripts/bootstrap-datepicker.pt-BR.js"></script>
    <link href="~/Content/datepicker.css" rel="stylesheet" media="screen"/>
    <script src="~/Scripts/bootstrap-datepicker.js" ></script>*@

    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" />
    <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css" />

    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

    <link href="~/Content/Menu.css" rel="stylesheet" />
    <link href="~/Content/Styles.css" rel="stylesheet" />

    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <script type="text/javascript" src="~/Scripts/bootstrap.js"></script>
    <link href="~/Content/datepicker.css" rel="stylesheet" media="screen" />
    @*<script src="~/Scripts/bootstrap-datepicker.js"></script>*@
    @*<script type="text/javascript" src="~/Scripts/bootstrap-datepicker.pt-BR.js"></script>*@

</head>
<body>

    <div id="tabs" style="border: none">
        <ul>
            <li><a href="#tabs-1">PDV</a></li>
            <li><a href="#tabs-2">Eventos</a></li>
            <li><a href="#tabs-3">Formulários</a></li>
            <li class="agendamento"><a href="#agendamento">Agendamento</a></li>
        </ul>

        <div id="tabs-1">
            <form role="form">

                <!--A tag ul contem os titulos das abas-->
                <div class="row">

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <label for="txtCnpjPdv">CNPJ/Razão Social:</label>
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <label for="txtContato">Contato:</label>
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <label for="ddlFiltrarRede" class="col-sm-2 control-label">Filtrar Rede:</label>
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <label for="ddlFiltrarStatus" class="col-sm-2 control-label">Filtrar Status:</label>
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <label for="ddlFiltrarVisao" class="col-sm-2 control-label">Visão:</label>
                    </div>
                </div>

                <div class="row">
                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <input type="text" class="form-control col-sm-2" id="txtCnpjPdv" placeholder="Digite o Cnpj" />
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <input type="text" class="form-control col-sm-2" id="txtContato" placeholder="Digite o contato" />
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <select class="form-control col-sm-2" name="ddlTipoEvento" id="ddlFiltrarRede">
                            <option value="SemFiltro">Sem Filtro</option>
                            <option value="Associativa">Associativa</option>
                            <option value="Franquia">Franquia</option>
                            <option value="Propria">Própria</option>
                        </select>
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <select class="form-control col-sm-2" name="ddlTipoEvento" id="ddlFiltrarStatus">
                            <option value="SemFiltro">Sem Filtro</option>
                            <option value="Ok">Ok</option>
                            <option value="Atençao">Atenção</option>
                            <option value="Erro">Erro</option>
                            <option value="NaoCadastrado">Não Cadastrado</option>
                            <option value="Desativado">Desativado</option>
                        </select>
                    </div>

                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                        <select class="form-control col-sm-2" name="ddlTipoEvento" id="ddlFiltrarVisao">
                            <option value="Geral">Geral</option>
                            <option value="SouzaCruz">Souza Cruz</option>
                        </select>
                    </div>

                    <button type="button" class="btn btn-success" onclick=" return MontaGridPdv();">Pesquisar</button>
                    <br />
                    <br />
                </div>

                <div id="montaPesquisaGrid">
                </div>
            </form>
        </div>
        @*Fim div tab-1*@


        <div id="tabs-3">
        </div>
        @*Fim div tab-3*@

        <div id="agendamento">

            <form class="form-horizontal" role="form">
                <div class="form-group">
                    <label for="txtCnpjOs" class="col-sm-1 control-label">CNPJ:</label>
                    <div class="col-sm-2">
                        <input type="text" class="form-control" id="txtCnpjOs" placeholder="Digite o Cnpj">
                    </div>
                    <label for="txtOS" class="col-sm-1 control-label">OS:</label>
                    <div class="col-sm-2">
                        <input type="text" class="form-control input-small" id="txtOS" placeholder="Digite o numero da OS">
                    </div>
                    <input id="btnPesquisar" type="button" class="btn btn-success" value="Pesquisar" onclick=" return MontaAgendamento();" />
                </div>
            </form>
            <br />

            <div id="filtro">
                <div id="FiltroPesquisa">


                </div> @*Div filtro pesquisa*@
            </div> @*Div filtro*@

        </div> @*Fecho a div agendamento*@

        <div id="tabs-2">
            <form class="form-horizontal" role="form">

                <div class="form-group">
                    <label for="txtCnpj" class="col-sm-2 control-label">CNPJ:</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control" id="txtCnpj" placeholder="Digite o Cnpj">
                    </div>
                    <label for="imgStatus" class="col-sm-2 control-label">Status:</label>
                    <div class="col-sm-2">
                        <img src="~/Images/Certo.png" class="img-responsive col-md-4 control-label" id="imgStatus" />
                    </div>
                </div>

                <div class="form-group">
                    <label for="txtRazaoSocial" class="col-md-2 control-label">Razão Social:</label>
                    <div class="col-md-6">
                        <input type="text" class="form-control" id="txtRazaoSocial" placeholder="Digite a razão social">
                    </div>
                </div>

                <div class="form-group">
                    <label for="txtIdEvento" class="col-md-2 control-label">ID Evento:</label>
                    <div class="col-md-2">
                        <input type="text" class="form-control" id="txtIdEvento" placeholder="Digite um evento">
                    </div>
                </div>

                <div class="form-group">
                    <label for="txtDescricao" class="col-md-2 control-label">Descrição:</label>
                    <div class="col-md-3">
                        <textarea class="form-control" id="txtDescricao" placeholder="Digite uma descrição" rows="4"></textarea>
                    </div>
                    <label for="ddlTipoEvento" class="col-md-2 control-label">Tipo Evento:</label>
                    <div class="col-md-3">
                        <select class="form-control" name="ddlTipoEvento" id="ddlTipoEvento">
                            <option selected="selected" value="0"></option>
                            <option value="2">Acesso Remoto</option>
                            <option value="8">Agendamento de Visita Técnica</option>
                            <option value="6">Alteração de Cadastro</option>
                            <option value="9">Ativar PDV</option>
                            <option value="4">Contato Comercial</option>
                            <option value="11">Contato Técnico</option>
                            <option value="10">Inativar PDV</option>
                            <option value="15">Instalação Extrator Cod. Interno</option>
                            <option value="16">Processo 2</option>
                            <option value="14">Processo Interno PDV</option>
                            <option value="12">Sem Intervenção Técnica</option>
                            <option value="1">Visita Técnica</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="ddlAcao" class="col-md-2 control-label">Próxima Ação:</label>
                    <div class="col-md-3">
                        <select class="form-control" id="ddlAcao">
                            <option selected="selected" value="0"></option>
                            <option value="2">Acesso Remoto</option>
                            <option value="8">Agendamento de Visita Técnica</option>
                            <option value="6">Alteração de Cadastro</option>
                            <option value="9">Ativar PDV</option>
                            <option value="4">Contato Comercial</option>
                            <option value="11">Contato Técnico</option>
                            <option value="10">Inativar PDV</option>
                            <option value="15">Instalação Extrator Cod. Interno</option>
                            <option value="16">Processo 2</option>
                            <option value="14">Processo Interno PDV</option>
                            <option value="12">Sem Intervenção Técnica</option>
                            <option value="1">Visita Técnica</option>
                        </select>
                    </div>
                    <label for="ddlUsuario" class="col-md-2 control-label">Usuário:</label>
                    <div class="col-md-3">
                        <select class="form-control" id="ddlUsuario">
                            <option selected="selected" value="0"></option>

                        </select>
                    </div>
                </div>

                <div class="control-group">
                    <label for="txtUsuarioProxAcao" class="col-md-2 control-label">Data Próxima Ação:</label>
                    <div class="col-md-3">
                        <input type="text" class="datepicker" id="txtUsuarioProxAcao" />
                    </div>
                    <button type="button" class="btn btn-success">Finalizar</button>
                    <button type="button" class="btn btn-success" onclick=" return ">Confirmar</button>
                </div>
                <br />

                <div class="control-group">
                    <button type="button" class="btn btn-primary">Pesquisar</button>
                    <button type="button" class="btn btn-warning" onclick=" return ">Cancelar</button>
                    <button type="button" class="btn btn-success" onclick=" return GravaEvento();">Confirmar</button>
                </div>
                <br />

                <div id="subtabs" style="border: none">
                    <ul>
                        <li><a href="#tabs-11">Eventos PDV</a></li>
                        <li><a href="#tabs-21">Minhas Tarefas</a></li>
                    </ul>

                    <div id="tabs-11">
                        <div class="pull-right" id="tabela4">
                            <br />
                            <table class="table table-striped table-ordered table-bordered">
                                <thead>
                                    <tr>
                                        <td><strong>ID</strong></td>
                                        <td><strong>Tipo</strong></td>
                                        <td><strong>Descrição</strong></td>
                                        <td><strong>Usuário</strong></td>
                                        <td><strong>Data de Inclusão</strong></td>
                                        <td><strong>Status</strong></td>
                                        <td></td>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_CRM_Evento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_TipoEvento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.DE_Usuario getFormattedDate(this.DT_Inclusao)</small></td>
                                        <td class="col-xs-4 col-sm-4 col-md-4 col-lg-4"><small>Paulo Silva</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>03/07/2014 14:48:09</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_TipoEvento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                                            <button type="button" class="btn btn-primary">Visualizar</button></td>
                                    </tr>
                                    <tr>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_CRM_Evento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_TipoEvento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.DE_Usuario getFormattedDate(this.DT_Inclusao)</small></td>
                                        <td class="col-xs-4 col-sm-4 col-md-4 col-lg-4"><small>Araken leão</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>03/07/2014 14:48:09</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_TipoEvento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                                            <button type="button" class="btn btn-primary">Visualizar</button></td>
                                    </tr>
                                    <tr>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_CRM_Evento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_TipoEvento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.DE_Usuario getFormattedDate(this.DT_Inclusao)</small></td>
                                        <td class="col-xs-4 col-sm-4 col-md-4 col-lg-4"><small>Flávia</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>03/07/2014 14:48:09</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><small>this.ID_TipoEvento</small></td>
                                        <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                                            <button type="button" class="btn btn-primary">Visualizar</button></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div id="tabs-21">

                        <div class="form-group">
                            <label for="txtFiltroData" class="col-md-2 control-label">Filtro por data:</label>
                            <div class="col-md-2">
                                <input type="text" class="form-control" id="txtFiltroData" placeholder="Digite uma data válida">
                            </div>


                            <label for="ddlFiltro" class="col-md-2 control-label">Ação:</label>
                            <div class="col-md-2">
                                <select class="form-control" id="ddlFiltro">
                                    <option selected="selected" value="0"></option>
                                    <option value="2">Sem Filtro</option>
                                    <option value="8">Aberto</option>
                                    <option value="6">Finalizado</option>
                                </select>
                            </div>
                            <button type="button" class="btn btn-primary">Filtrar</button>
                        </div>
                    </div>
            </form>
        </div>

    </div>

    <input type="hidden" id="txtCnpjRazao" />

</body>

<script src="@Url.Content("~/Scripts/jquery.maskedinput.min.js")"></script>
<script src="@Url.Content("~/Scripts/Menu.js")"></script>
@*<script src="@Url.Content("~/Scripts/main.js")"></script>*@
<script src="@Url.Content("~/Scripts/jquery-color.js")"></script>

<script src="@Url.Content("~/Scripts/Util.js")"></script>
<script src="@Url.Content("~/Scripts/GerenciarPDV/GerenciarPDV.js")"></script>

<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>

</html>
  • Test is a string, need to put quotes alert('teste');

  • All right, but that’s not the problem. I’ve put digits, variables and nothing happens.

  • I’m just not seeing in your html generated by ajax, no label, or link.

  • The reticence indicates that there are more things, as it is huge, I just put the beginning and the table I want to filter

1 answer

6

Assuming that in the success you are actually mounting the HTML you refer to in the question, your problem is that the table is also created by success of your call to Ajax.

As the table ID does not exist when the code attaches the event to click is read, the same is discarded.

You should attach the event to an element that exists on the page and not to one that you will apply to the page with Ajax.

Attach event to dynamic content in an element that exists on the page

Example in Jsfiddle

$('body').on('click', ' #tblPesquisa td', function (e) {
  var ancora = $(this).find('label a');
  var valor = ancora.text();
  alert(valor);
});

Example attaching the event to the tag body, despite recommending that attachments with less Scope.

Attach event after inserting dynamic content into the DOM:

Example in Jsfiddle

$.ajax({

  url: '/GerenciarPDV/DetalhesEvento',
  dataType: "json",
  contentType: "application/json; charset=utf-8",
  type: "POST",
  data: JSON.stringify({ _cnpj: _cnpjrazao }),
  success: function (data) {

    // cronstruir HTML e enviar para o DOM

    // anexar evento
    $('#tblPesquisa').on('click', 'td', function (e) {
      var ancora = $(this).find('label a');
      var valor = ancora.text();
      alert(valor);
    });

  // ...

Example attaching the event to dynamic content BUT after it has been inserted into the DOM.


jQuery documentation for the method .on().

  • @pnet In your code in jQuery you have nowhere a <label/> with a <a/> within it. Yours .find('label a') will never find anything. What you have is in some places: a <a/> with a <small/> inside; in other places a <label/> with text inside.

  • @pnet Can you add your HTML after rendered in the browser? That is, after the Ajax call the HTML appears on your page, right? You can copy that using inspector of your browser and put in question that portion of HTML? So you can see for sure the HTML you’re putting on the page and understand where your confusion is.

  • I tried copying from Chrome and could not. It gives me the Copy As Html option, but only copies or edits the line where the cursor is.

  • The interesting thing is that now enters the controller, but does not enter the success of ajax. I used it here. $("#tblPesquisa tbody"). on("click", "td", Function() { Alert($(this).text(); _cnpjrazao = $(this).text(); }); $(this). text() is empty

Browser other questions tagged

You are not signed in. Login or sign up in order to post.