Getting a jquery function to work with an ajax call?

Question

The Following text area is generated via an ajax call. But the redactor (text editor) is not working. I know i have to blur (or somehow refresh) but i've tried and tried but cant get the scripts to work. Any help?

<textarea sname='content' id='redactor'>Ajax updated content</textarea>


$(document).ready(function() {

    var buttons = ['html', 'formatting', 'bold', 'italic', 'deleted', 'unorderedlist', 'orderedlist', 'outdent', 'indent', 'link', 'horizontalrule'];

    $('#redactor').redactor({
        focus: true,
        buttons: buttons,
        maxHeight: 500
    });

});



 $.ajax({
      type: "POST",
      dataType: "json",
      url: "phpVars/ajaxUpload.php", //Relative or absolute path to response.php file
      data: data,
      success: function(data) {
        $(".the-return").html(
         data["form"]
        );  
      }

    });

the above is the ajax call

Answer 1

you can place the code inside a function:

function loadEditor()
{
    var buttons = ['html', 'formatting', 'bold', 'italic', 'deleted', 'unorderedlist', 'orderedlist', 'outdent', 'indent', 'link', 'horizontalrule'];

    $('#redactor').redactor({
        focus: true,
        buttons: buttons,
        maxHeight: 500
    });
}

$.ajax({
    type: "POST",
    dataType: "json",
    url: "phpVars/ajaxUpload.php",
    data: data,
    success: function(data)
    {
        $(".the-return").html( data["form"] );
        loadEditor();
    }
});

and after ajax response, you can call this function. Hope this helps.