DataTables - onClick -> InsertText within textareas

JustMe69

Hi there,

I'm still new to JS and DataTables.
I have a table with a form.
I'd like to use buttons to insert text into a textarea within the rows.
All I can find with google are JS-functions that don't work with tables.

I want to use the insertText-function for the 2 textareas 'de_text*' and 'lang_text'
The numbers in the id an name for the 'de_text'-textarea are some tryouts to get it to work.

The function insertText is copied from selfhtml.org modified a little, but it doesen't work.
What do I have to do to get it work?

my Table/HTML-Code:
[code]


Schlüssel
Aktionen
Fall (Singular/Plural u.a.)
deutscher Text
Text in 'es'




     








bezahlmoeglichkeiten




BR
%s

  





   

Bezahlmöglichkeiten


Formas de pago





weitershoppen




BR
%s

  





   

weitershoppen


seguir comprando

<!-- more line cut off -->
Showing 1 to 4 of 4 entries


$('#form_transl_edit').submit( function() {
var tran_data = oTable.$('input,textarea').serialize();
console.log(tran_data);
$('#form_transl_edit input[name="transl_data"]').val(tran_data);
} );


[/code]

My JS-code:
[code]
var oTable;

function fnClickAddRow() {
$('#transl_edit').dataTable().fnAddData( [ "", "", "", "", "" ] );
};


function insertText(formId,elemName,aText) {
var input = document.forms[formId].elements[elemName];

console.log(formId,elemName,aText);
console.log(input);

input.focus();
/* für Internet Explorer */

if(typeof document.selection != 'undefined') {
/* Einfügen des Formatierungscodes */
var range = document.selection.createRange();
var insText = range.text;
range.text = aText + insText;
/* Anpassen der Cursorposition */
range = document.selection.createRange();
if (insText.length == 0) {
// range.move('character', -eTag.length);
} else {
range.moveStart('character', aText.length + insText.length);
}
range.select();
}
/* für neuere auf Gecko basierende Browser */
else if(typeof input.selectionStart != 'undefined')
{
/* Einfügen des Formatierungscodes */
var start = input.selectionStart;
var end = input.selectionEnd;
var insText = input.value.substring(start, end);

console.log(start,end,insText);

input.value = input.value.substr(0, start) + aText + insText + input.value.substr(end);
/* Anpassen der Cursorposition */
var pos;
if (insText.length == 0) {
pos = start + aText.length;
} else {
pos = start + aText.length + insText.length;
}
input.selectionStart = pos;
input.selectionEnd = pos;
}
/* für die übrigen Browser */
else
{
/* Abfrage der Einfügeposition */
var pos;
var re = new RegExp('^[0-9]{0,3}$');
while(!re.test(pos)) {
pos = prompt("Einfügen an Position (0.." + input.value.length + "):", "0");
}
if(pos > input.value.length) {
pos = input.value.length;
}
/* Einfügen des Formatierungscodes */
var insText = prompt("Bitte geben Sie den zu formatierenden Text ein:");
input.value = input.value.substr(0, pos) + aText + insText + input.value.substr(pos);
}
};



$(document).ready(function() {

oTable = $('#transl_edit').dataTable( {
"bPaginate": false,
"bLengthChange": false,
"bStateSave": true,
"bFilter": false,
"bSort": false,
"bInfo": true,
"bAutoWidth": true

} );

});
[/code]