Sweetalert: Posição do botão

Criado em 27 ago. 2015  ·  9Comentários  ·  Fonte: t4t5/sweetalert

Existe alguma maneira de alterar a posição dos botões de confirmação e cancelamento?

Comentários muito úteis

O CSS de substituição pode ser como

.sa-button-container {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
          justify-content: center;
}
.sa-button-container .cancel {
    -webkit-order: 2;
            order: 2;
}
.sa-button-container .sa-confirm-button-container {
    -webkit-order: 1;
            order: 1;
}

Todos 9 comentários

Atualmente não existe uma forma de configuração. Você pode reorganizar um pouco por meio de CSS. As desvantagens são possíveis quebras durante a atualização e possível confusão de css tentando cobrir todos os pontos de interrupção.

O CSS de substituição pode ser como

.sa-button-container {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
          justify-content: center;
}
.sa-button-container .cancel {
    -webkit-order: 2;
            order: 2;
}
.sa-button-container .sa-confirm-button-container {
    -webkit-order: 1;
            order: 1;
}

@gremz @ t4t5 Eu tive o mesmo problema. Eu olhei na fonte para ver se eu personalizo, mas não consegui encontrar uma maneira não hacky de personalizar o próprio plugin. Então eu me conformei com um jeito hacky em meu próprio código :-) Se você estiver usando jquery, algo assim funciona bem.

function swapModalButtons(){
  $("button.cancel").before($("button.confirm"))
}

src: modules / injected-html.js line: 53 vc verá o que vc quer, é por isso que vc não pode definir sua ordem.
modificar: sweetalert.min.js
encontre , remova sua posição, está funcionando.

Vocês já deveriam estar usando este fork: https://limonte.github.io/sweetalert2/

Na verdade, é atualizado e tem uma opção de botão reverso.

@ryanmortier Estou em um grande projeto e teria que passar por muita burocracia para usar sweetalert2
@ghost Eu editei o injetado-html.js e alterei a ordem ... Eu tentei alterar sweetalert.min.js. É um trabalho muito complicado. Não sei dizer se fiz corretamente ou não. Os botões ainda não foram invertidos. Qual é a melhor maneira de editar um arquivo mínimo?

Isso agora pode ser feito no 2.0 usando:

swal({ 
  buttons: { 
    confirm: true, 
    cancel: true,
  }
})

... para definir a ordem exata!

Vocês já deveriam estar usando este fork: https://limonte.github.io/sweetalert2/

este link está desatualizado, aqui está o correto https://sweetalert2.github.io/

Oi. Eu tive o mesmo problema. E resolva com este trabalho arround. Vá para o .min e procure:
div class = "sa-button-container"> \ n
\ n

\ n

e altere a confirmação para cancelar e cancelar para confirmar. e está feito.

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

vmitchell85 picture vmitchell85  ·  6Comentários

voodoo6 picture voodoo6  ·  4Comentários

adiwithadidas picture adiwithadidas  ·  4Comentários

AlexV525 picture AlexV525  ·  4Comentários

mouro001 picture mouro001  ·  3Comentários