[JS] Tekst invoeren in textarea op plaats van cursor* - Softwareontwikkeling

woensdag 7 december 2005 23:42

Acties:

N/A

Topicstarter

Ik probeer net zoiets te maken als op GoT voor een CMS alleen ik stuit op een probleempje. Ik heb namelijk een code gemaakt dat als je op [B] klikt (een plaatje) dat er in een textarea de code komt te staan, mbv de volgende code:

code:

<script type="text/javascript"> 
function insertcode(type) 
{ 
    var strInsert = ''; 
     
    switch (type) 
    { 
        case 'bold': 
            strInsert = '<b></b>';         
            break; 
             
        default: 
            break; 
    } 
     
    var elmBericht = document.getElementById("bericht"); 
    var strCurContent = elmBericht.value; 
    var strNewContent = strCurContent + strInsert; 
    elmBericht.value = strNewContent; 
} 
</script> 
[img]"bold.gif"[/img]

Nu wil ik dat er twee functies in komen, ik weet alleen niet hoe:
1. (belangrijkste): De code moet op de plek komen waar op dat moment de cursor is (en niet zoals nu aan het einde van de lap tekst in de textarea)
2. Als je een stuk text selecteert en je drukt op de [B] knop, dan moet er links van de tekst een komen en rechts van het geselecteede stuk een .

Ik heb op de search gekeken maar ik kon niks vinden. Wel genoeg over het aanmaken van de codes, maar dat is me dus wel gelukt.

woensdag 7 december 2005 23:46

Acties:

NMe

Quia Ego Sic Dico.

Stickies lezen is moeilijk.

HTML, CSS, JavaScript, Flash en Director? Kijk eerst hier!
*** Over topictitels in P&W - lezen voor topic openen!!! ***

PW>>WG

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.

woensdag 7 december 2005 23:56

Acties:

Ad Hox

N/A

Topicstarter

Schaamteloos. Excuus!

donderdag 8 december 2005 09:35

Acties:

orf

PHP:

function insertAtCursor(myField, myValue) {
  //IE support
  if (document.selection) {
    myField.focus();
    sel = document.selection.createRange();
    sel.text = myValue;
  }
  //MOZILLA/NETSCAPE support
  else if (myField.selectionStart || myField.selectionStart == '0') {
    var startPos = myField.selectionStart;
    var endPos = myField.selectionEnd;
    myField.value = myField.value.substring(0, startPos)
                  + myValue 
                  + myField.value.substring(endPos, myField.value.length);
  } else {
    myField.value += myValue;
  }
}

// calling the function

insertAtCursor(document.formName.fieldName, 'this value');

donderdag 8 december 2005 10:22

Acties:

Ad Hox

N/A

Topicstarter

Volgens mij is dat gewoon Javascript, want in PHP vorm werkt het niet.

In JS trouwens ook niet, ik heb 'this value' veranderd naar het berict id van de form, en ik heb dit scriptje onderaan mijn bovenstaande script gezet, onder de laatste }.

Toch werkt het nog niet..

donderdag 8 december 2005 10:30

Acties:

frickY

Natuurlijk is het geen PHP. PHP is een server-side taal en daarmee dus nutteloos voor dergelijke toepassingen, tenzij je het venster bij elke druk op een knop wilt verversen

En volgens mij zijn er meer dan voldoende JS-voorbeelden te vinden. Al gegooglet?

[ Voor 20% gewijzigd door frickY op 08-12-2005 10:30 ]

donderdag 8 december 2005 10:37

Acties:

Verwijderd

http://www.google.nl/search?hl=nl&q=textarea+selected+text&meta=

Hier moet je we lwat mee vinden denk ik

donderdag 8 december 2005 10:47

Acties:

Ad Hox

N/A

Topicstarter

Indd, de juiste zoektermen doen wonderen.

code:

<script type="text/javascript"> 
<!-- 
    function formatText (tag) { 
        var selectedText = document.selection.createRange().text; 
         
        if (selectedText != "") { 
            var newText = "<" + tag + ">" + selectedText + "</" + tag + ">"; 
            document.selection.createRange().text = newText; 
        } 
    } 
//--> 
</script>

Die zet de code netjes om de geselecteerde tekst. Alleen nu nog bij mijn FP: hoe krijg ik hem dan op de plek waar de cursor op dat moment is? Ik heb het script geprobeerd die orf heeft gepost, maar ik weet niet wat ik bij 'this value' in moet voeren. Want zo werkt ie namelijk niet

[ Voor 20% gewijzigd door Ad Hox op 08-12-2005 10:56 ]

donderdag 8 december 2005 11:54

Acties:

orf

PHP was alleen voor de code highlighting:

PHP:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
<script type="text/javascript">
 
  function insert(value){
    insertAtCursor(document.getElementById('tekstvak'), value);
  }
  
  function insertAtCursor(myField, myValue) {
    //IE support
    if (document.selection) {
      myField.focus();
      sel = document.selection.createRange();
      sel.text = myValue;
    }
    //MOZILLA/NETSCAPE support
    else if (myField.selectionStart || myField.selectionStart == '0') {
      var startPos = myField.selectionStart;
      var endPos = myField.selectionEnd;
      myField.value = myField.value.substring(0, startPos)
                    + myValue
                    + myField.value.substring(endPos, myField.value.length);
    } else {
      myField.value += myValue;
    }
  }
</script>
    <title></title>
  </head>
  <body>
    <form method="post" action="#">
      <p><input type="button" value="B" onclick="insert('[' + this.value + ']');" /> 
      <input type="button" value="I" onclick="insert('[' + this.value + ']');" /> 
      <input type="button" value="U" onclick="insert('[' + this.value + ']');" /></p>

      <p><textarea name="tekstvak" id="tekstvak"></textarea></p>
    </form>
  </body>
</html>