score:0

You need to Use Ajax. i think this must help you to solve your issues.
Follow tutorial of ajax on

http://www.tutorialspoint.com/ajax

http://www.w3schools.com/ajax/default.ASP

score:0

You will be using Ajax.

  1. Make the textarea post to where you want the other pages to load from (database or flat file).

  2. Have the other pages run a javascript loop that waits a few seconds then loads the contents of the file via ajax then displays it in the area you want it.

    It's not too hard with jquery

http://api.jquery.com/load/

score:0

I'm going to disagree with the answers below. If you do an AJAX call it should be once and it should get you a definition list of what conversions to perform. The actual conversions should be done on the client side, otherwise you're going to end up sending a request to the server with every keypress!

Here's an example of how you could do it:

// The array of regex patterns to look for
$format_search =  [
    /\[b\](.*?)\[\/b\]/ig,
    /\[i\](.*?)\[\/i\]/ig,
    /\[u\](.*?)\[\/u\]/ig
]; // note: NO comma after the last entry

// The matching array of strings to replace matches with
$format_replace = [
    '<strong>$1</strong>',
    '<em>$1</em>',
    '<span style="text-decoration: underline;">$1</span>'
];

$('textarea').on('keyup', function() {
    var preview = $(this).val().trim();
    // Perform the actual conversion
    for (var i = 0; i < $format_search.length; i++) {
        preview = preview.replace($format_search[i], $format_replace[i]);
    }
    // show the preview in your div
    $('#preview').html(preview);

});

Here's a demo fiddle. The replacement code is used from this answer.

My suggestion is that if you're going to use AJAX, use it to get the definitions for $format_search and $format_replace from a datasource rather than using it to parse the replacements.

score:0

Try this code:

<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script>
function myFunction(x)
{
    var text = x.value;
    $('#preview').show();
    document.getElementById('preview').innerHTML=text;
}
</script>
</head>
<body>
<div id="preview" style="display:none"></div>
<textarea name="presentation" onkeyup="myFunction(this)"></textarea>

</body>
<style>
    #preview{
    width:200px;
    height:auto;
    border:1px solid black;
}
</style>

Hope this is the answer to your question.


Related Query

More Query from same tag