Is there a way to make a text area partially editable? (make only portions of the text editable)

by

You could do this (just an outlined idea, no code):

Devise a regex that matches your entire text. Use fixed strings for the unmodifiable parts, and use [\s\S]*? for the modifiable parts. Use ^ and $ to anchor your regex. 

/^This is fixed text\. Now something editable:[\s\S]*?Now fixed again\.$/

Now react to the keyup event, and probably other events as well (like paste).

With every relevant event, make a check if the regex still matches.

If it doesn’t, cancel the event.

Effectively, this should stop modifications to parts that are literal in the regex and thus make certain parts of your text read-only.

Don’t forget to test the string on the server side as well after the form post – never trust that the client cannot send invalid values.

EDIT

You can use a regex quote function to dynamically build that regex from strings, this should save you a lot of the hassle.

function regexQuote(s) { return s.replace(/[\[\]^$*+?{}.|\\]/g, "\\$&") }

usage

var re = new Regex(
  "^" + 
  [regexQuote(fixedPart1), regexQuote(fixedPart2)].join("[\\s\\S].*?")
   + "$"
);

More Related Contents:

  1. Rendering HTML inside textarea
  2. How do you get the cursor position in a textarea?
  3. Limit number of lines in textarea and Display line count using jQuery
  4. Limiting number of lines in textarea
  5. jQuery – select all text from a textarea
  6. how to get the value of a textarea in jquery?
  7. Count textarea characters
  8. How to read line by line of a text area HTML tag
  9. CSS Textarea that expands as you type text [duplicate]
  10. Get the offset position of the caret in a textarea in pixels [duplicate]
  11. Get value from text area [duplicate]
  12. Twitter bootstrap – Focus on textarea inside a modal on click
  13. Set cursor to specific position on specific line in a textarea
  14. How to select line of text in textarea
  15. Max characters in textarea with jquery
  16. How to reload current page without losing any form data?
  17. Difference between jQuery `click`, `bind`, `live`, `delegate`, `trigger` and `on` functions (with an example)?
  18. Uncaught TypeError: Cannot read property ‘msie’ of undefined – jQuery tools
  19. How to pass parameters in GET requests with jQuery
  20. How do I synchronize the scroll position of two divs?
  21. jquery: what does “$(this)” exactly mean?
  22. Using Jquery Datatable with AngularJs
  23. Use JSONP to load an html page
  24. How to enable Bootstrap tooltip on disabled button?
  25. jQuery Standards and Best Practice [closed]
  26. How do I refresh a DIV content?
  27. showing progressbar progress with ajax request
  28. Trigger events when the window is scrolled to certain positions
  29. Get content of span
  30. Uncaught NotFoundError: Failed to execute ‘insertBefore’ on ‘Node’: The node before which the new node is to be inserted is not a child of this node

Leave a Comment