CODEWITHSUNDEEP
jqueryhtml
Saul Ramirez
Saul Ramirez

Reputation: 33

My generic click event for anchors doesn't work

I have this method to fill an Aside. that works but this method not. the event is trigger without click on any anchor

    $('a.list-group-item btn btn-default').click(function (event) {
       var O = this.id;
       var title = $(O).val();
       MiFun(title);
       $('#myModal').modal({ show: true })
    }

at the moment of debugger skips that function. I want to fill first the Aside, then click in an Anchor and these anchor show me a Modal view with information. My anchors includ 

    <a href='#'class='list-group-item btn btn-default'> tittle</a>

my all Script First i call MifuncObj to fill an Aside with title's of events Then i create the generic click event and i want to click an anchor an then when i click this anchor show me a modal view. the anchors contains titles of events in a dataBase. the generic event of anchors is to get the name of the title and get the other information of the event on DB and put in the modal 

(document).ready(function () {
MiFuncObj();
$('a.list-group-item.btn.btn-default').click(function (event) {
    var O = this.id;
    var title = $(O).val();
    MiFuncion(title);
    $('#myModal').modal({ show: true })
})
});
function MiFuncObj() {
$.ajax(
    {
        url: "http://localhost/CasaHogar/WServices/WSMetodos.asmx/TopEventos",
        dataType: "json",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        success: function (msg) {
            debugger;              
            var datos_usuarios = (typeof msg.d) == 'string' ? eval('(' + msg.d + ')') : msg.d;
            for (var i = 0; i < datos_usuarios.length; i++) {
                var titulo = datos_usuarios[i].Titulo;
                $('#table').append("<a href='#'class='list-group-item btn btn-default'><h4 class='list-group-item-heading'>" + titulo + "</h4></a>");
            }              
        },
        error: function (result) { alert("ERROR" + result.status + '' + result.statusText); }

    }
    );
}
function MiFuncion(title) {
var obJason = {
    "Titulo": title
}
var actiondata = JSON.stringify(obJason);
$.ajax(
    {
        url: "http://localhost/CasaHogar/WServices/WSMetodos.asmx/BuscarTitulos",
        data: "{'parametro':" + actiondata + "}",
        dataType: "json",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        success: function (msg) {
            debugger;
            var datos_usuarios = (typeof msg.d) == 'string' ? eval('(' + msg.d + ')') : msg.d;
            for (var i = 0; i < datos_usuarios.length; i++) {
                var titulo = datos_usuarios[i].Titulo;
                var contenido = datos_usuarios[i].Contenido;
                var fecha = datos_usuarios[i].Fecha;
                $('#modal-header').append("<h3>" + titulo + "</h3>");
                $('#modal-body').append("<p>" + titulo + "</p>");
                $('#modal-footer').append("<h4>" + titulo + "</h4>");
            }
        },
        error: function (result) { alert("ERROR" + result.status + '' + result.statusText); }

    }
    );
 }

Upvotes: 0

Views: 42

Answers (1)

Mohamed-Yousef
Mohamed-Yousef

Reputation: 24001

1st :You need to read about selectors (a) has same classes so you should use

$('a.list-group-item.btn.btn-default')

2nd: you don't set any Id for anchor to use this.id it will return undefined

3rd : nothing called .val() for anchor you need to use .text() to return ( tittle) or you need to use .attr(); to get attribute value from anchor

I really can't got your point .. what you trying to do?? show more html

$('body').on('click','a.list-group-item.btn.btn-default',function (event) {
    event.preventDefault(); // to prevent reloading if you need it
    var title = $(this).text();
    MiFun(title);
    $('#myModal').modal({ show: true })
}

Upvotes: 1

Related Questions