Class: AccordionBody

.Components.Layout.AccordionBody(id, options, href, data, include_variablesnullable, contextnullable, use_spinneropt)

new AccordionBody(id, options, href, data, include_variablesnullable, contextnullable, use_spinneropt)

Componente que renderiza el body de un Accordion de Bootstrap.

Parameters:
Name Type Attributes Default Description
id string

Identificador unico de body

options string

Json string de propiedades que van al Collapse dentro del Body

href string

Operacion que se va a ejecutar con tarjet operation al abrir el panel

data string

Json string con data que se envia a la operacion (solo si href tiene un valor)

include_variables string <nullable>

Lista de variables que se incluyen en la data (separadas por espacio)

context string <nullable>

Contexto contenedor de las variables que se van a incluir, es requerido si se incluyen variables

use_spinner BooleanString <optional>
"true"

Si es true se muestra un spinner mientras se espera la respuesta del servidor

Source:
Example
<accordion default_open="1">
  <accordion_item options='{"className":"card card-style"}'>
    <div class="card-header d-flex">
      <div class="align-self-center">
        <h6 class="pt-1 font-14 font-600">Factura 0000-111111</h6>
      </div>
      <div class="align-self-center ms-auto text-end">
        <h6 class="pt-1 font-14 font-600">10/03/2022</h6>
      </div>
    </div>
    <accordion_header target="1">
      <!-- header --> 
      <div class="card-body d-flex mb-2" style="height: auto; padding: 0.5rem 1rem;">
        <div class="align-self-center" style="max-width: 240px">
          <h6 class="mb-n1 font-12 opacity-60">Heladera con Freezer Gafa 282 Litros</h6>
          <h6 class="pt-1 mb-n1 font-12 opacity-60">Smart TV 43" Samsung</h6>
          <h6 class="pt-1 mb-n1 font-12 opacity-60">Aire Acondicionado Split</h6>
        </div>
        <div class="align-self-center ms-auto text-end pt-1">
          <p class="mb-0 font-11 opacity-70" style="line-height: 10px">Monto a pagar</p>
          <p class="mb-0 font-15 color-blue-dark font-700">$20.000,00</p>
          <p class="mb-0 font-11 opacity-70" style="line-height: 10px">Vence</p>
          <p class="mb-0 font-13 color-blue-dark font-700">19/03/2022</p>
        </div>
      </div>
      <!-- comprobante fin -->  
    </accordion_header>
    <accordion_body id="1" href='Operacion' data='{"propiedad": "valor"}'>
      <strong>
        This is the second item's accordion body.
      </strong>
      You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the{' '}
      <code>
        .accordion-body
      </code>
      , though the transition does limit overflow.   
    </accordion_body>
  </accordion_item>