Event only fired after first click

Question

I have a list of categorie. When I click on some category to fire an AJAX request the first time the request is not sent. When i click a second time it works great. Here is my code

<?php foreach($this->category as $value) { ?>
  <li data-cid=<?= $value['cat_id']?> class="cid">
    <a href="http://localhost/mvc/viewbycat/index/<?= $value['cat_id'] ?>">
      <?= $value['cat_name']?>
    </a>
  </li>
<?php } ?>

$(document).ready(function () {
  var catid;
  var count = 0;

  $('li.cid').click(function (e) {
    count = 0;
    var limit = 6;
    var offset = 0;
    e.preventDefault();
    $("#main").empty();
    catid = $(this).attr('data-cid');
    displayRecords1(limit, offset, catid);
  });

Thanks for help!

Please don't edit and add code to the users question @guradio, he has a syntax error, don't fix it as it confuses people, clean the formatting but don't fix errors within the questioners code, rolled back. — Script47, Apr 27 '17 at 07:11

score 1 · Answer 1 · edited May 23 '17 at 12:25

You had a Unexpected end of input error because you were missing });,

  $(document).ready(function() {
  var catid,
      count = 0;
  $('li.cid').click(function(e) {
    e.preventDefault();

    var limit = 6,
        offset = 0,
        count = 0;

    $("#main").empty();

    catid = $(this).attr('data-cid');

    displayRecords1(limit, offset, catid);
  });
});

Change,

<li data-cid=<?= $value['cat_id']?> class="cid">

To

/** Note the double quotes. **/
<li data-cid="<?= $value['cat_id']?>" class="cid">

Avoid using short tags in PHP as they might be disabled on your server.
Always check the console for JavaScript errors.
Try and initialise all your variables together at the start to prevent confusion.

Reading Material

Opening Console in Different Browsers

PHP Short Tags

JavaScript Syntax Checker - For quick checking of your syntax.

score 0 · Answer 2 · answered Apr 27 '17 at 07:14

0

You didn't close the $(document).ready

$(document).ready(function () { 

    var catid;
    var count=0;

    $('li.cid').click(function (e) {
        count=0;
        var limit= 6;
        var offset = 0;
        e.preventDefault();
        $("#main").empty();
        catid = $(this).attr('data-cid');

        displayRecords1(limit, offset, catid);
    });
}); // This here

answered Apr 27 '17 at 07:14

Mazz

1,859
26
38

this is just the part of code of document ready at the i have the right end. Thnak you – Krastyo Krastev Apr 27 '17 at 07:26
It is not the reason to work from second click as i sad i close document.ready i have more code – Krastyo Krastev Apr 27 '17 at 07:36

Event only fired after first click

2 Answers2