jquery를 사용하여 텍스트 상자 값을 지움

Question

"bootstrap-datetimepicke"을 사용했으며 jQuery를 사용하여 텍스트 상자를 지우는 동안 문제가 발생했습니다.

내 HTML 코드는 다음과 같습니다 그것이 빈 값을 보여줍니다 콘솔 버튼을 눌러 확인한 후

$(function() { 
    $('.datetimepicker4').datetimepicker({ 
     pickTime: false, 
     maskInput: true, 
    }); 
}); 


$(document).ready(function() { 
    $('button[type="reset"]').click(function() { 
     $('#from').val('');  
     console.log($('#from').val()); 
    }); 
}); 

:

<div class="input-group datetimepicker4"> 
    <input id="from" name="from" value="<?php echo $from ?>" placeholder="from" data-format="yyyy-MM-dd" readonly="readonly" type="text" style="background-color: #fff"> 
    <span class="input-group-addon add-on"> 
     <i data-time-icon="icon-time" data-date-icon="icon-calendar" class="icon-calendar"></i> 
    </span> 
</div> 
<button class="btn btn-default" type="reset" name="reset">Reset</button> 

다음 코드를 사용하여 내가 텍스트 상자의 값을 재설정하려고 텍스트 상자 값이 이전 값을 유지하는 동안 수정하십시오 (입력 값은 스크립트로 채워지지만 사용자는 재설정 버튼을 클릭하는 동안 값을 재설정 할 수 있어야합니다).

버튼 유형을 '재설정'에서 '버튼'으로 변경 했으므로 이제 또 다른 문제가 발생했습니다. 검사 요소 창을 열면 양식을 제출 한 후 같은 값을 게시 초래 이전 값을 표시하면서 버튼 값을 클릭

$(document).ready(function() { 
    $('button[type="button"]').click(function() { 
     $('#from').val('');  
     console.log($('#from').val()); 
    }); 
}); 

더 이상 표시되지 않습니다.

Answer 1

datpicker와 관련된 input이 숨겨져있어 올바른 값을 변경하지 못하기 때문에 문제가 발생했습니다. API를 확인하면 setValue 메소드가 표시되어 숨겨진 필드와 표시 필드를 동기화 상태로 유지하기 위해 필드 값을 업데이트해야합니다. 이것을 시도하십시오 :

$('.datetimepicker4').data('datetimepicker').setDate(null);