2017-06-19 11 views
2

をキャプチャするためのセレクタであると 入力キーは、JSFコンポーネントに押している間、ここで

キー

$(".disableEnterKey").keydown(function(event) { 

    var charCode = event.charCode || event.keyCode || event.which; 
    if (charCode === 13) { 

     event.preventDefault(); 

     return false; 
    } 
}); 
を入力して無効に無効にprimefaces-timepickerの入力フィールド

<pe:timePicker id="startTime" 
    value="#{xxx.xxx.var}" 
    mode="popup" startHours="0" endHours="23" 
    showPeriod="true" widgetVar="startTimeWidget" 
    styleClass="form-control keyDownFalse disableEnterKey" > 
     <p:ajax event="timeSelect" partialSubmit="false" 
     listener="#{xxx.var}" 
     update="endTime, duration" 
     oncomplete="keyDownFalse()"/> 
    </pe:timePicker> 

しかし、問題のためのキーを入力するAjaxのメカニズムを制限ここにはの更新の属性がajaxタグの下にあります。すなわち、開始時刻の時間ピッカーイベントがトリガーされると、終了時刻の時間ピッカーを更新している。しかし、開始時刻のピックアップから時間と分を選択するのは、を押すのではなく、というキーを押すだけです。

Image before pressing enter on Start-time

終了時刻が開始時刻に押されたキー入力したら、更新されます。

Image before pressing enter on Start-time

だから何を押し、入力しながら、Ajaxのメカニズムを制限するための正確な方法であることを私に提案してください。前もって感謝します。

+0

あなたはオンコンプリートで何も返しません...あなたはすべきです... https://stackoverflow.com/questions/34354839/return-false-not-working-and-action-gets-triggered-on -click-of-hcommandbuttonは重複していますか? – Kukeltje

+0

@Kukeltje、私は 'return'は変更に影響を与えないと思います。すなわち、oncomplete = "return keyDownFalse()"を返す。 –

+0

私も試しました。しかし、私のユースケースには影響はありません。 –

答えて

0

実際にこの動作のソースは、入力キーの 実際には、元のjQueryプラグインfgtimepicker、正確にはhereによって更新されています。

これを修正するには、プラグインを拡張し、この特定の動作を変更するのが最も簡単な方法です。延長アプローチの例:

$.extend($.fgtimepicker, { 
    _doKeyDown: function (event) { 
     //copy original source here with different handling for 13/enter case   
    } 
}); 

ケースの取り扱いを入力しての完全な例は次のように考えられます

<script> 
//<![CDATA[ 
    $.extend($.fgtimepicker, { 
     _doKeyDown: function (event) { 
      var inst = $.fgtimepicker._getInst(event.target); 
      var handled = true; 
      inst._keyEvent = true; 
      if ($.fgtimepicker._timepickerShowing) { 
       switch (event.keyCode) { 
        case 9: 
         $.fgtimepicker._hideTimepicker(); 
         handled = false; 
         break; // hide on tab out 
        case 13: 
         //CHANGE Enter KEY BEHAVIOUR 
         //NO NEED TO FIRE THE UPDATE ---> $.fgtimepicker._updateSelectedValue(inst); 
         $.fgtimepicker._hideTimepicker(); 
         handled = false; 
         break; // hide on tab out 
        case 27: 
         $.fgtimepicker._hideTimepicker(); 
         break; // hide on escape 
         default: 
          handled = false; 
       } 
      } else if (event.keyCode == 36 && event.ctrlKey) { // display the time picker on ctrl+home 
       $.fgtimepicker._showTimepicker(this); 
      } else { 
       handled = false; 
      } 
      if (handled) { 
       event.preventDefault(); 
       event.stopPropagation(); 
      } 
    } 
}); 
//]]> 
</script> 

これは、Enterキーによって生じたいかなる更新イベントを防止するであろう。

このスクリプトは、document.readyなどのように遅れずに起動しなければならないことに注意してください。これが、後で来る人にはもっと明確になるように、<script>タグに拡張子を含めた理由です。

関連する問題