Как отключить signalPad (холст) после успеха ajax

Я использую этот плагин.

Мое приложение отправляет подпись с вызовом ajax. При успешном возврате ajax я хочу отключить любые изменения подписи пользователем. Последнее, что я пробовал, это следующее, но панель для подписи все еще активна и рисует линии (слушатели не отсоединены):

   function showResponse(itemJson, statusText, xhr, $form) {

    if (itemJson.status == 'success') {

        debugger;

        $($form.find('.clearButton')).remove();
        $($form.find('button')).remove();

        $form.find('input').attr('readonly', 'readonly');

        var api = $form.signaturePad();
        var sig = api.getSignatureString();

        api.updateOptions({displayOnly: true})
//        $form.signaturePad({displayOnly: true}).regenerate(sig);

    }
}

Кто-нибудь знает, как обновить существующий signalPad, чтобы он перешел в отключенный режим?


canvas jquery html5-canvas signaturepad
person vlr    schedule 09.11.2015    source источник
comment
Работает следующее изменение параметра: $sigPadElem.signaturePad({ penColour: '#FF0000' }).regenerate($sigPadElem.find('.output').val());   -  person Luke Wenke    schedule 12.10.2016
comment
Не могли бы вы поделиться, какое решение вы в итоге использовали? Спасибо.   -  person Marklar    schedule 04.11.2017
comment
Недавно я удалил панель для подписи. Но до этого я использовал подход, чтобы проверить, существует ли подпись, а затем загрузить неактивную панель с подписью. Должен быть пример, как показать существующие подписи.   -  person vlr    schedule 08.11.2017

Ответы (4)


arrow_upward
3
arrow_downward

Обычно я использую:

api.off();

В моем софте работает

person Fabio Ottaviani    schedule 25.10.2018

arrow_upward
1
arrow_downward

Для тех, кто найдет эту ветку при использовании пакета React react-signature-canvas; вы можете отключить его, позвонив padRef.current.off().

Вот базовый пример пэда, который отображает заданную подпись (sigValue) и отключен.

const SignatureDisplay = ({ sigValue }) => {
  const padRef = useRef({})

  useEffect(() => {
    padRef.current.fromData(sigValue || [])
    padRef.current.off()
  }, [])

  return (
    <SignaturePad
      ref={padRef}
      canvasProps={{
        height: 200,
        width: 400
      }}/>
  )
}
person Mark Potter    schedule 10.09.2020
comment
Немного не по теме, но как вы сделали padRef.current доступным в useEffect? Мой всегда выдает undefined при попытке вызвать fromData - person Luan Scudeler; 15.10.2020
comment
@LuanScudeler немного чит, но если вы передадите аргумент useRef, который будет начальным значением, в приведенном выше коде я установил его в пустой объект, который не дает ему взорваться в useEffect. В качестве альтернативы вы можете просто добавить защитное предложение к useEffect, например, if(!padRef.current) { return }. Извините, что не вернулся раньше, надеюсь, это поможет. - person Mark Potter; 02.11.2020

arrow_upward
0
arrow_downward

В jquery.signaturepad.js добавлено:

  $.extend(self, {
    /**
     * A property to store the current version of Signature Pad
     */
    signaturePad : '{{version}}'
...
    , disableCanvas : function () { disableCanvas() }    

    , clearAndDraw : function () { drawIt() }
...

Чтобы использовать его:

$sigPadElem.signaturePad().disableCanvas();

or:

$sigPadElem.signaturePad().clearAndDraw();

Интересно, можно ли сделать этот функционал без модификации плагина? (Кстати, я не могу дать награду себе...)

person Luke Wenke    schedule 12.10.2016

arrow_upward
-2
arrow_downward

Попробуй это

$('.sigPad').signaturePad('disable');
person Lineesh    schedule 30.11.2015