How to accses to laravel if-else variable with jquery

0 votes

I have a dating project. We are using laravel 6 and jquery 3.4.1

The problem is that I need to draw a div when receiving AJAX.

So, javascript and blade template :

static countNewMessages() {
    $.get('/some/link/here', results => {
      let total = 0;
      if (results.length === 0) {
        $('.chat__list-block').each(function (index) {
          $(this).removeClass('chat__list-block_new');
        });
        $('.chat__list-non-read-counter').addClass('chat__list-non-read-counter_hidden').each(function (index) {
          $(this).text('');
        });
        $('#number-of-new-messages').addClass('d-none').removeClass('d-flex').html('');
        $('#inbox-messages-count-title').html('0');

        return false;
      }

      results.forEach(v => {
        if (Chat.containers?.threads) {
          let threadElement = $('.chat__list-block[data-pid=' + v.from_userid + ']');

          threadElement.addClass('chat__list-block_new');
          threadElement.find('.chat__list-non-read-counter')
            .addClass('chat__list-non-read-counter_hidden')
            .text(v.count);

          if (0 < threadElement.length && !threadElement.hasClass('chat__list-block_active') && 0 < v.count) {
            threadElement.find('.chat__list-non-read-counter')
              .removeClass('chat__list-non-read-counter_hidden');
          }
        }

        total += v.count;
        $('#number-of-new-messages').addClass('d-flex').removeClass('d-none').html(total);
        $('#inbox-messages-count-title').html(total);
      });
    });
  }
@if(count($threads))
<div>Chat requests</div>
@else
<div>No chat requests</div>
@endif

 Run code snippet

Expand snippet

The standard if-else behavior in the template suits me fine. If a user visits the page but has no messages the second block is displayed, and if he has messages the first block is displayed. But if a user who is on the block "no chat requests" and receives new messages then the block "chat requests" is rendered only after a full refresh of the page.

If you need more information, please let me know

Aug 8 in Web Development by gaurav
• 18,960 points
71 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.

Related Questions In Web Development

0 votes
1 answer

How to use JQuery with ReactJS

Yes, we can use jQuery in ReactJs. ...READ MORE

answered Jun 22 in Web Development by rajatha
• 7,440 points
68 views
0 votes
1 answer

How to hide a div with jQuery?

We hide the divs by adding a CSS ...READ MORE

answered Jun 27 in Web Development by rajatha
• 7,440 points
33 views
0 votes
0 answers

How to scroll to top of page with JavaScript/jQuery?

Is there a way to control browser ...READ MORE

Jul 1 in Web Development by gaurav
• 18,960 points
206 views
0 votes
0 answers

how to spin and stop wheel has custom position with jquery

this i my code. I am using this ...READ MORE

Jul 27 in Web Development by gaurav
• 18,960 points
50 views
0 votes
0 answers

jQuery + JSON how to define key from variable

I have the following code $.post( ...READ MORE

Jul 28 in Web Development by gaurav
• 18,960 points
29 views
0 votes
0 answers

How to show message in model body if bootstrap model have no data in jquery

I'm trying to display a text message ...READ MORE

Jul 29 in Web Development by gaurav
• 18,960 points
39 views
0 votes
1 answer

Uncaught Error: Bootstrap's JavaScript requires jQuery

Hello @kartik, You have provided wrong order for ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,780 points
16,451 views
0 votes
1 answer

How to make Bootstrap popover Appear/Disappear on hover instead of click?

Hello @kartik, Set the trigger option of the popover to hover instead ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,780 points
1,413 views
0 votes
1 answer

How to enable Bootstrap tooltip on disabled button?

Hii @kartik, You can wrap the disabled button ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,780 points
3,313 views
0 votes
1 answer

Error: cannot call methods on button prior to initialization; attempted to call method 'loading'

Hii @kartik, It's caused by jquery-ui and bootstrap-button ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,780 points
3,207 views
webinar REGISTER FOR FREE WEBINAR X
Send OTP
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP