CODEWITHSUNDEEP
jquery
sandeep
sandeep

Reputation: 449

jquery click event is not firing

Hi here i want to fire next or prev button click event of jquery full calender. But the click event is not firing am tried several ways it did not fired

$(document).ready(function () {
    $('#contaner_wrapper').css("height", "100%");
    $(".fc-button-prev a span").trigger('click');

    $(".fc-button-next a span").trigger('click');       
    $('.fc-button-prev a span').click(function () {
        alert($("#calendar").fullCalendar('getView').start.toString());

        var abc = $("#calendar").fullCalendar('getView').start.toString();

        var ab = $("#calendar").fullCalendar('getView').end.toString();
        // Displaymonthevents();
    });

    $('.fc-button-next a span').click(function () {
        // Displaymonthevents();
        alert($("#calendar").fullCalendar('getView').start.toString());
        var abc = $("#calendar").fullCalendar('getView').start.toString();

        var ab = $("#calendar").fullCalendar('getView').end.toString();
    });

});

Upvotes: 0

Views: 910

Answers (3)

Anton
Anton

Reputation: 11

use .live() - old version or .on() - new vesion. Example:

$(".fc-button-prev a span").live('click', function(){ alert($("#calendar").fullCalendar('getView').start.toString()); })

Upvotes: 0

sasbury
sasbury

Reputation: 301

Assuming that you put the code in the same order as your web page, I think you just need to do the trigger after you register the click handler.

Here is a JS Fiddle that does what I think you are asking for:

http://jsfiddle.net/Td5cG/1/

$('.fc-button-prev a span').click(function () {
    alert("clicked it");
});

$(".fc-button-prev a span").trigger('click');

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388316

The problem could be, you are using fullcalendar and these elements are created by fullcalendar plugin, so when this script is executed there is a possibility that the plugin may not have yet created. Which means the event handlers will not get registered.

So the solution is to make use of event delegation

$(document).ready(function () {
    $('#contaner_wrapper').css("height", "100%");
    $(document).on('click', '.fc-button-prev a span', function () {
        alert($("#calendar").fullCalendar('getView').start.toString());

        var abc = $("#calendar").fullCalendar('getView').start.toString();

        var ab = $("#calendar").fullCalendar('getView').end.toString();
        // Displaymonthevents();
    });

    $(document).on('click', '.fc-button-next a span', function () {
        // Displaymonthevents();
        alert($("#calendar").fullCalendar('getView').start.toString());
        var abc = $("#calendar").fullCalendar('getView').start.toString();

        var ab = $("#calendar").fullCalendar('getView').end.toString();
    });

    $(".fc-button-prev a span").trigger('click');
    $(".fc-button-next a span").trigger('click');       
});

Upvotes: 1

Related Questions