Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Edytowanie tekstu w textarea
Forum PHP.pl > Forum > PHP
benusso
Witam

Interesuje mnie problem, jak wykonać taką rzecz, mianowicie edytowanie tekstu w formularzu, w polu textarea przed dodaniem go do bazy.
Interesuje mnie aby po zaznaczeniu danego słowa wstawić go w wybrane znaczniki html, interesuje mnie tylko kilka znaczników,a następnie wraz z nimi dodać do bazy dancyh.

Macie jakieś propozycję jak rozwiązać ten problem ?

Pzdr.
skowron-line
Jakiś czas temu robiłem taki edytor bbcode nie działa do końca ponieważ nie miałem czasu go dokończyć, ale te jak mówisz kilka funkcji może jakoś z niego wyłuskasz.
http://skowronline.pl/bbcode/
* nie testowałem tego więc na własne ryzyko.
koderrr
uzyj tinymce
thek
Można albo dużymi edytorami w stylu FCKeditor czy TinyMCE, albo czymś tak prostym jak ta moja mała funkcyjka w JS winksmiley.jpg

field -> id_pola typu textarea
strBefore -> tag początkowy czyli przykładowo <b>
strAfter -> tag końcowy czyli przykładowo </b>

Ja go daję jako zdarzenie onclick dla jakiegoś guzika smile.gif Zaznaczony tekst może być jak widać także listą i wtedy każde linia złamana przez enter zostanie uznana jako element listy.
To taki banalny przykład na szybkie zastosowanie JS bez sięgania od razu do frameworków typu jQuery. Działa z tego co wiem na wszystkich przeglądarkach smile.gif
[JAVASCRIPT] pobierz, plaintext
  1. function putTag(field, strBefore, strAfter) {
  2. element = document.getElementById(field);
  3. element.focus();
  4. // IE
  5. if (document.selection) {
  6. var oRange = document.selection.createRange();
  7. var numLen = oRange.text.length;
  8. if(strBefore == "<ol><li>" || strBefore == "<ul><li>") {
  9. oRange.text.replaceAll("\n", "</li><li>");
  10. }
  11. oRange.text = strBefore + oRange.text + strAfter;
  12. return false;
  13. // FF i Opera
  14. } else if (element.setSelectionRange) {
  15. var selStart = element.selectionStart, selEnd = element.selectionEnd;
  16. var oldScrollTop = element.scrollTop;
  17. if(strBefore == "<ol><li>" || strBefore == "<ul><li>") {
  18. oRange = element.value.substring(selStart, selEnd).replaceAll("\n", "</li><li>");
  19. } else {
  20. oRange = element.value.substring(selStart, selEnd);
  21. }
  22. element.value = element.value.substring(0, selStart) + strBefore + oRange + strAfter + element.value.substring(selEnd);
  23. element.setSelectionRange(selStart + strBefore.length, selEnd + strBefore.length);
  24. element.scrollTop = oldScrollTop;
  25. element.focus();
  26. } else {
  27. var oldScrollTop = element.scrollTop;
  28. element.value += strBefore + strAfter;
  29. element.scrollTop = oldScrollTop;
  30. element.focus();
  31. }
  32. }
[JAVASCRIPT] pobierz, plaintext

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.