Status with jquery

Asked

Viewed 63 times

0

I have html with the following Divs:

<div class="tag" id="div-statusActive" data-status="statusActive">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusActive'"></span>
    </div>
</div>

<div class="tag" id="div-statusPendingPayment" data-status="statusPendingPayment">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusPendingPayment'"></span>
    </div>
    <div class="tag__action">
        <span class="icon-alert-circle"></span>
    </div>
</div>

<div class="tag" id="div-statusCancellationPending" data-status="statusCancel_requested">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusCancellationPending'"></span>
    </div>
</div>

<div class="tag" id="div-statusSignatureCanceled" data-status="statusCanceled">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusSignatureCanceled'"></span>
    </div>
</div>

jquery searches for the result in an api and shows which account status, but is not working.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
$('div[data-status="' + state + '"]').show()
</script>

why?

javascript html jquery

  • Check if the expected string with console.log(state).

  • Your html seems to be incomplete, and you don’t use scripts within tag scripts that import an external script. I suggest you take a look at How to create a Minimum, Complete and Verifiable example and after that edit your question so that we can help you.

  • 1

    Another thing, your script is wrong. Use a script tag to load jQuery and other with the code, and not all in the same script.

  • the return of the.log console is PROCESSING.

  • scripts are in a file other than html, when the status is active the return is correct, using $('div[data-status=statusActive]'). show()

  • 1

    Note the Vinicius comment and the last one of mine. Vc is loading jQuery into a script tag and inserting code into the same tag. You have to use two script tags, one to load jQuery and one with code.

  • As already said above you have to close the tag, open and close again. Thus: <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $('div[data-status="' + state + '"]'). show() </script>

Show 2 more comments

1 answer

0


$('.tag').hide(); // esconde todos os status

var status = "SignatureCanceled" ; // adicione aqui o status desejado

$('#div-status'+status).show(); //complete o id do div desejado com sua variável para exibir
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="tag" id="div-statusActive" data-status="statusActive">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusActive'">statusActive</span>
    </div>
</div>

<div class="tag" id="div-statusPendingPayment" data-status="statusPendingPayment">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusPendingPayment'">statusPendingPayment</span>
    </div>
    <div class="tag__action">
        <span class="icon-alert-circle"></span>
    </div>
</div>

<div class="tag" id="div-statusCancellationPending" data-status="statusCancel_requested">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusCancellationPending'">statusCancellationPending</span>
    </div>
</div>

<div class="tag" id="div-statusSignatureCanceled" data-status="statusCanceled">
    <div class="tag__title tag__title--spaced">
        <span data-bind="widgetLocaleText: 'statusSignatureCanceled'">statusSignatureCanceled</span>
    </div>
</div>

Browser other questions tagged javascript html jquery

You are not signed in. Login or sign up in order to post.