3

Tenho uma tabela com duas TD apenas(CNPJ e Razão Social). Minha controller tem um método que recebe 2 parâmtros(CNPJ ou Razao). Esses parâmetros são enviados via jquery. Eu não estou conseguindo fazer o seguinte. Ao clicar na TD CNPJ ou Razao, deveria enviar o valor da TD em questão. Veja como está meu código, depois de 1 milhão de tentativas.

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

            alert(teste);
        });

Não entra nem no alert. O código todo está assim. Meu html é dinâmico, ou seja, é montado no sucesso do 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) {

    }

});

}

Meu cshtml como está. Ele possui 4 tabs e esse é a 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>
4
  • Teste é uma string, precisa colocar aspas alert('teste'); 7/07/2014 às 20:47
  • Tudo bem, mas esse não é o problema. Já coloquei dígitos, variáveis e nada acontece.
    – pnet
    7/07/2014 às 20:52
  • Só não estou vendo no seu html gerado pelo ajax, nenhuma label, nem link. 7/07/2014 às 20:55
  • As reticências indicam que há mais coisas, como é enorme, eu coloquei apenas o início e o table que quero filtrar
    – pnet
    7/07/2014 às 21:59

1 Resposta 1

6

Assumindo que no success efectivamente estás a montar o HTML a que te referes na pergunta, o teu problema é que a tabela também é criada pelo success da tua chamada de Ajax.

Como o ID da tabela não existe quando o código que anexa o evento de click é lido, o mesmo é descartado.

Deverás anexar o evento a um elemento que exista na página e não a um que vais aplicar à página com Ajax.

Anexar evento a conteúdo dinâmico num elemento que exista na página

Exemplo no JSFiddle

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

Exemplo anexando o evento à tag body, apesar de recomendar que anexes com menos scope.

Anexar evento após inserção do conteúdo dinâmico no DOM:

Exemplo no 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);
    });

  // ...

Exemplo anexando o evento a conteúdo dinâmico MAS após o mesmo ter sido inserido no DOM.


Documentação jQuery para o método .on().

4
  • @pnet No teu código em jQuery não tens em lado nenhum uma <label/> com um <a/> dentro da mesma. O teu .find('label a') nunca vai encontrar nada. O que tu tens é nuns lugares: um <a/> com uma <small/> dentro; noutros lugares uma <label/> com texto lá dentro.
    – Zuul
    8/07/2014 às 12:58
  • @pnet Podes adicionar o teu HTML após renderizado no navegador? Ou seja, após a chamada de Ajax o HTML aparece na tua página, certo? Podes copiar isso usando o inspector do teu navegador e meter na pergunta essa porção de HTML? Assim dará para ver ao certo o HTML que estás a colocar na página e entender onde está a tua confusão.
    – Zuul
    8/07/2014 às 13:01
  • Tentei copiar pelo chrome e não consegui. Ele me dá a opção de Copy As Html, porem só copia ou edita a linha em que está o cursor.
    – pnet
    8/07/2014 às 13:15
  • O interessante é que agora entra na controller, mas não entra no sucesso do ajax. Usei isso aqui. $("#tblPesquisa tbody").on("click", "td", function () { alert($(this).text()); _cnpjrazao = $(this).text(); }); O $(this).text() está vazio
    – pnet
    8/07/2014 às 14:21

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .