Добавьте css к элементу после отправки формы ajax

Question

У меня есть веб-форма на сайте drupal, которая отправляется с помощью запроса ajax.

В теге PHP я показываю форму, которая использует передачу ajax, и фрагмент выглядит следующим образом:

if(isset($_GET['dev-testing'])) {

  $block = module_invoke('webform', 'block_view', 'client-block-139');
  print render($block['content']);
  ?>
  <div class="unique" style="display: none;">              
    <?php

    print l('Download info pack', render($entry_info), array('attributes' => array('class' => array('btn', 'btn-border hidden-link'), 'target' => '_blank')));?>

  </div>

<?php } ?>

Я хочу иметь возможность добавлять CSS в div класса, уникального после отправки этой формы.

Попробовал это и ничего не работает после того, как я нажму на кнопку отправки:

$("button.webform-submit").on('submit', function(){
    $('.unique').css("display", "block");
});

Также пробовал использовать ajaxSend и Complete. Ничего не работает

$(document).ajaxSend(function() {
     $('.unique').css("display", "block");
});

$(document).ajaxComplete(function(event, request, settings) {
    $('.unique').css("display", "block");
});

Как мне этого добиться?

Answer 1

Вы можете добавить PreventDefault () к кнопке вашей формы

$('button.webform-submit').on('click', function(e)) {
   e.PreventDefault()
}

Это предотвращает отправку, которая происходит.Теперь вы можете добавить свой код CSS изменения

 $('.unique').css("display", "block");

И последнее, но не менее важное: отправить форму вручную

$('#idForm').submit();

Окончательный код:

$('button.webform-submit').on('click', function(e)) {
   e.PreventDefault();
   $('.unique').css("display", "block");
   $('#idForm').submit();
}

https://api.jquery.com/event.preventdefault/

https://api.jquery.com/submit/