Member Avatar for sandysooso

my code is to handle the maxlength in the multiline textbox (textarea) so it works just like maxlength in the singleline text box , so I handled it onkeypress , but if I copy and paste , i want to substring the length to the maxlength from the clipboard , just to behave like the singleline textbox, the problem that the clipboard works only for the internet explorer but it doesn't work in other browsers
so function in 

function count(Obj, long) {
  //IE only
    var board = new String();
    var maxlength = new Number(parseInt(long ));

    if (window.event.ctrlKey) {

        if (window.clipboardData != "") {
      
if (window.clipboardData.getData("Text").length >= maxlength) {
  
     board.value = window.clipboardData.getData("Text");
     Obj.value = board.value.substring(0, maxlength);
        }
   }
 }

 if (Obj.value.length >= maxlength) {
  return false;
     }   
     else
     return true;     
 
}

and wrote in vb.net :

Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
        If (Me.textbox1.MaxLength <> 0) Then

            Me.textbox1.Attributes.Add("onpaste", "return count (this,'" + Me.textbox1.MaxLength.ToString + "');")
            Me.textbox1.Attributes.Add("onkeypress", "return count (this,'" + Me.textbox1.MaxLength.ToString + "');")
         
        End If


    End Sub

and in aspx i wrote :

<head runat="server">
    <title>Untitled Page</title>
    <script src="JScript.js" language="jscript" type ="text/jscript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TextBox ID="textbox1" runat ="server" Textmode="MultiLine" MaxLength="10"></asp:TextBox>
    
    </div>
    </form>
</body>
</html>

so, It works very proper in Internet explorer , but in chrome ,it limits to the maximum length in writing but in copy and paste it doesn't work, as clipboard is not working in chrome, is there any way to make it work in multi-Browser?

p.s :the above is just a sample

Thanks and Best regards,
Sandy

Edited by sandysooso because: n/a
  • 2 Contributors
  • 3 Replies
  • 1K Views
  • 2 Weeks Discussion Span
  • Latest Post Latest Post by Member #905211

Dani AI

Generated

Quick summary and a practical fix. The global window.clipboardData approach that used is an IE-only, nonstandard artifact; Chrome/Firefox/Edge provide clipboard access inside the paste event instead. The HTML maxlength attribute now exists for <textarea> and helps, but to truncate text before it lands in the field the reliable cross‑browser way is to intercept the paste event, read the clipboard text from the event, and insert a truncated substring (or, as a fallback, trim the value on input). (stackoverflow.com)

Practical implementation (attach after DOM ready): this handler reads clipboard text, prevents the browser default, computes how many characters fit (taking current selection into account), inserts the truncated text at the caret, and restores the caret. Add an input listener that trims any overlong value as a safety fallback.

const el = document.getElementById('textbox1');

el.addEventListener('paste', function (e) {
  const max = this.maxLength || parseInt(this.getAttribute('maxlength')) || 0;
  if (!max) return; // no limit
  e.preventDefault();
  const clip = (e.clipboardData || window.clipboardData).getData('text/plain');
  const s = this.selectionStart, t = this.selectionEnd;
  const before = this.value.slice(0, s), after = this.value.slice(t);
  const space = Math.max(0, max - (before.length + after.length));
  const insert = clip.slice(0, space);
  this.value = before + insert + after;
  const pos = before.length + insert.length;
  this.setSelectionRange(pos, pos);
});

el.addEventListener('input', function () {
  const max = this.maxLength || parseInt(this.getAttribute('maxlength')) || 0;
  if (max > 0 && this.value.length > max) this.value = this.value.slice(0, max);
});

The paste handler uses the standard ClipboardEvent clipboardData object; it works in modern Chrome/Firefox/Edge and falls back where needed. For advanced flows (reading clipboard outside of a paste gesture) the async Clipboard API (navigator.clipboard.readText()) exists but requires HTTPS and explicit permission/user gesture. That explains why ’s short “no” missed the paste-event approach — it is possible cross‑browser with the patterns above. (developer.mozilla.org)

Recommended Answers

All 3 Replies

Member Avatar for Member #905211

is there any way to make it work in multi-Browser?

no

Member Avatar for sandysooso

so is there any way to limit multiline textbox (maxlength) in multibrowser through the copy and paste
but before pasting the content in the textbox ?...

Member Avatar for Member #905211

Not through copy and paste. You can only give the field a maxlength (nothing to do with copy and paste)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.