locked
How to restrict user ,not to input value from keyboard into textbox? RRS feed

  • Question

  • User-367318540 posted

    i am trying to restrict user, that not to input value from keyboard into textbox,just barcode scanner allowed and not to copy paste.

    Below code i tried ,but it is not working.

     <script type="text/javascript">
        let inputStart, inputStop;
    
    $("#TextBox1")[0].onpaste = e => e.preventDefault();
    // handle a key value being entered by either keyboard or scanner
    var lastInput
    
    let checkValidity = () => {
    	if ($("#TextBox1").val().length < 10) {
      	  $("#TextBox1").val('')
      } else {
        $("body").append($('<div style="background:green;padding: 5px 12px;margin-bottom:10px;" id="msg">ok</div>'))
      }
      timeout = false
    }
    
    let timeout = false
    $("#TextBox1").keypress(function (e) {
      if (performance.now() - lastInput > 1000) {
      	$("#TextBox1").val('')
      }
    	lastInput = performance.now();
    	if (!timeout) {
      	timeout = setTimeout(checkValidity, 200)
      }
    });
    </script>
    
                <asp:TextBox ID="TextBox1" AutoPostBack="true" runat="server"  Placeholder="Input Bale No" autocomplete="off"    OnTextChanged="TextBox1_TextChanged" Height="30px" Width="208px" style="margin-left: 0px"></asp:TextBox>
    

    Sunday, January 3, 2021 10:04 AM

All replies

  • User475983607 posted

    Hide the textbox using CSS.

    <div style="display:none;">
        <asp:TextBox ID="TextBox1" runat="server" Text="Hello World"></asp:TextBox>
    </div>

    Sunday, January 3, 2021 3:57 PM
  • User1535942433 posted

    Hi akhterr,

    Accroding to your description,if you need to restrict the textbox,you could use readonly.

    <asp:TextBox ID="TextBox1" AutoPostBack="true" runat="server"  Placeholder="Input Bale No" autocomplete="off" OnTextChanged="TextBox1_TextChanged" Height="30px" Width="208px" style="margin-left: 0px" ReadOnly="true"></asp:TextBox>
    

    Best regards,

    Yijing Sun

    Monday, January 4, 2021 1:50 AM
  • User-367318540 posted

    Hi mgebhard,

    i do not want to hide textbox ,i want input just from barcode scanner ,not from keyboard or (copy /paste).i share above CSS,which will take input within second and not allowing take input from keyboard.

    But that CSS code is not working.

    You may check code below link

    http://jsfiddle.net/uyzsb3o0/8/

    Monday, January 4, 2021 6:05 AM
  • User-367318540 posted

    Hi yij Sun,

     if i do readonly to textbox ,then not able to take input from barcode scanner.

    please check below link ,i want to integrate it ,in asp.net 

    http://jsfiddle.net/uyzsb3o0/8/

    Monday, January 4, 2021 6:07 AM
  • User1535942433 posted

    Hi akhterr,

    Accroding to your description,I have some doubts about barcode scanner.

    How do you fill the value of barcode scanner to the textbox? Do you have a scanner or it could copy the barcode into the textbox and restrict user.

    There are two ways:

    1.scanners "paste" the values in to the focused control.  In this way,you don't use onpaste() method.

    2.use key triage. You could add readonly when the user enter the value.And if it is the barcode,it remove the readonly.

    Note:When you use autopostback true,if the user enter the value,it will postback and clear. So,you need to use autopostback false and write postback using jquery.

    https://stackoverflow.com/questions/16296342/scan-barcode-into-a-specific-textbox

    Best regards,

    Yijing Sun

    Monday, January 4, 2021 9:39 AM
  • User-367318540 posted

    Can you provide me example.

    Monday, January 4, 2021 9:43 AM
  • User475983607 posted

    Hi mgebhard,

    i do not want to hide textbox ,i want input just from barcode scanner ,not from keyboard or (copy /paste).i share above CSS,which will take input within second and not allowing take input from keyboard.

    But that CSS code is not working.

    You may check code below link

    http://jsfiddle.net/uyzsb3o0/8/

    I tested the CSS approach and it works as expected.  The sample code you provided does not contain CSS so I'm not sure what you're talking about. 

    The code you're shared is incomplete.  I suspect you copied the code and do not understand how it works.  

    Monday, January 4, 2021 12:44 PM
  • User-367318540 posted

    Yes,i just did for make you understanding.

    Monday, January 4, 2021 4:52 PM
  • User1535942433 posted

    Hi akhterr,

    So could you tell us how do you fill the value of barcode scanner to the textbox? Do you have a scanner or it could copy the barcode into the textbox and restrict user? 

    Could you post your codes to us? It will help us to solve your problems.

    Best regards,

    Yijing Sun

    Tuesday, January 5, 2021 5:41 AM
  • User-367318540 posted

    Below is code ,and Barcode Scanner Device read barcode from Sticker and take that value into textbox.no code for that,

     <script type="text/javascript">
        let inputStart, inputStop;
    
    $("#TextBox1")[0].onpaste = e => e.preventDefault();
    // handle a key value being entered by either keyboard or scanner
    var lastInput
    
    let checkValidity = () => {
    	if ($("#TextBox1").val().length < 10) {
      	  $("#TextBox1").val('')
      } else {
        $("body").append($('<div style="background:green;padding: 5px 12px;margin-bottom:10px;" id="msg">ok</div>'))
      }
      timeout = false
    }
    
    let timeout = false
    $("#TextBox1").keypress(function (e) {
      if (performance.now() - lastInput > 1000) {
      	$("#TextBox1").val('')
      }
    	lastInput = performance.now();
    	if (!timeout) {
      	timeout = setTimeout(checkValidity, 200)
      }
    });
    </script>
    
                <asp:TextBox ID="TextBox1" AutoPostBack="true" runat="server"  Placeholder="Input Bale No" autocomplete="off"    OnTextChanged="TextBox1_TextChanged" Height="30px" Width="208px" style="margin-left: 0px"></asp:TextBox>

    Tuesday, January 5, 2021 5:59 AM