[Resolvido] Ajuda com tinymce arquivos por ajax

Opa blz?! Alguém que já utilizou ou utiliza esse editor pode me ajudar?

É o seguinte tenho a situação.

Uma página que é aberta via ajax para criar o conteúdo com o tinymce, seria a página de postagem, nela criei 2 submits um para registrar a página outro para pré visualização.

Essa seria a página:

Spoiler

<?php
require_once (__DIR__ . '/../../system/runtime.php');
$get = GlobalFilter::filterGet();
$str = new StrClean();
$check = new CheckData();
$action = $str->formatStr($get->action);

try {
if (!$check->insertPage(isset($session->member->type) ? $session->member->type : null)) {

 throw new ConstException("Sem permissão para gerenciar páginas", ConstException::INVALID_REQUEST);
 } else if ($check->checkCategory($action)) {
 throw new ConstException($check->resp, ConstException::SYSTEM_ERROR);
 } else {
 ?>
 <div class="page-load font-medium relative">
 <div id="preview"></div>
 <form method="POST" id="insertpage">
 <div class="container-high margin-lr over-x font-medium">
 <input name="category" type="hidden" value="<?= $action ?>"/>
 <p>Título</p>
 <input type="text" name="pagetitle" maxlength="30" class="input-default"/>

 <p>Conteúdo</p>
 <textarea name="pagecontent" class="mcepaste" style="min-height: 450px; resize:none;" wrap="off"></textarea>
 </div>
 <div class="bg-light-grey text-white align-right font-medium">
 <div class="container-high padding-all">
 <button type="submit" class="btn btn-info maximize-d" onclick="return smcore.postPage();">
 <span class="icon-paste"></span> Postar Página
 </button>
 <button type="submit" class="btn btn-default maximize-d text-grey" onclick="return smcore.previewPage();">
 <span class="icon-insert-template"></span> Pré visualizar
 </button>
 </div>
 </div>
 </form>
 </div>
 <script src="lib/javascript/ediorPage.js" type="text/javascript"></script>
 <?php
 }

} catch (ConstException $e) {
switch ($e->getCode()) {
case ConstException::INVALID_REQUEST:

 $agent = new UserAgent();
 $error = "*Arquivo - {$e->getFile()}\n"
 . "*Linha - {$e->getLine()}\n"
 . "*IP - {$agent->requestIP()}\n"
 . "*Navegador - {$agent->getBrowser()}\n"
 . "*Sistema - {$agent->getOs()}";
 DataApi::errorRegister($error);
 include (__DIR__ . '/../error/404.php');
 break;
 case ConstException::SYSTEM_ERROR:
 DataApi::errorRegister("{$e->getMessage()}\n *Arquivo [ {$e->getFile()} ]\n *Linha [ {$e->getLine()} ]");
 include (__DIR__ . '/../error/505.php');
 echo $action;
 break;
 }
}

  

	 

	Bem não há problemas enquanto a postagem, sim o problema está na questão que depois de salva em um banco de dados eu criei a opção de editar a página, ela é acessada via ajax.

	E então foi passar informações via get no ajax para fazer a consulta no banco de dados sobre essa página, assim preenchendo a texarea com o valor obtido.

	Daí o problema que ao tentar visualizar a previsão ou salvar a edição nunca salva, o que foi editado, só mantendo o valor que estava no banco.

	Aqui a página de edição:

 Spoiler

<?php
require_once (__DIR__ . '/../../system/runtime.php');
$get = GlobalFilter::filterGet();
$str = new StrClean();
$check = new CheckData();
$redirect = $str->formatStr($get->redirect);
$action = (int) $str->formatStr($get->action);

try {
if (!$check->insertPage(isset($session->member->type) ? $session->member->type : null)) {

 throw new ConstException("Sem permissão para gerenciar páginas", ConstException::INVALID_ACESS);
 } else if ($check->checkCategory($redirect)) {
 throw new ConstException($check->resp, ConstException::SYSTEM_ERROR);
 } else {
 $select = new Select();
 $select->selectQuery($redirect, "page_id = :dataid", "dataid={$action}");
 if ($select->selectError) {
 throw new ConstException($select->selectError, ConstException::QUERY_ERROR);
 } else if (!$select->selectCount()) {
 throw new ConstException("Não localizado página ID {$action} no banco de dados", ConstException::QUERY_ERROR);
 } else {
 $pageData = $select->selectResult()[0];
 ?>
 <div class="page-load font-medium relative">
 <div id="preview"></div>
 <form method="POST" id="insertpage">
 <div class="container-high margin-lr over-x font-medium">
 <input name="category" type="hidden" value="<?= $redirect ?>"/>
 <input name="pageid" type="hidden" value="<?= $action ?>"/>
 <p>Título</p>
 <input type="text" name="pagetitle" value="<?= $str->linkName($pageData->link_name) ?>" maxlength="30" class="input-default"/>
 <p>Conteúdo</p>
 <textarea name="pagecontent" class="mcepaste" style="min-height: 450px; resize:none;" wrap="off"><?= $pageData->page_data ?></textarea>
 </div>
 <div class="bg-light-grey text-white align-right font-medium">
 <div class="container-high padding-all">
 <button type="submit" class="btn btn-info maximize-d" onclick="return smcore.editPage();">
 <span class="icon-paste"></span> Editar Página
 </button>
 <button type="submit" class="btn btn-default maximize-d text-grey" onclick="return smcore.previewPage();">
 <span class="icon-insert-template"></span> Pré visualizar
 </button>
 </div>
 </div>
 </form>
 </div>
 <script src="lib/javascript/ediorPage.js" type="text/javascript"></script>
 <?php
 }
 }

} catch (ConstException $e) {
switch ($e->getCode()) {
case ConstException::INVALID_ACESS:

 $agent = new UserAgent();
 $error = "*Arquivo - {$e->getFile()}\n"
 . "*Linha - {$e->getLine()}\n"
 . "*IP - {$agent->requestIP()}\n"
 . "*Navegador - {$agent->getBrowser()}\n"
 . "*Sistema - {$agent->getOs()}";
 DataApi::errorRegister($error);
 include (__DIR__ . '/../error/404.php');
 break;
 case ConstException::SYSTEM_ERROR:
 DataApi::errorRegister("{$e->getMessage()}\n *Arquivo [ {$e->getFile()} ]\n *Linha [ {$e->getLine()} ]");
 include (__DIR__ . '/../error/505.php');
 break;
 case ConstException::QUERY_ERROR:
 DataApi::errorRegister("{$e->getMessage()}\n *Arquivo [ " . basename(__FILE__) . " ]\n *Linha [ {$e->getLine()} ]");
 include (__DIR__ . '/../error/404.php');
 break;
 }
}

  

	 

	Essas são as funções Javascript, que por sua vez solicitam dados de uma classe Javascript que criei para execuções de Ajax

 Spoiler

 /** ******************************************************
 * * @function : Executa o processo de postagem de
 * páginas a validação e feita em janela modal
 ** ******************************************************/
 var EditPage = function () {
 tinymce.triggerSave();
 modalControl('hiddenX');
 modalControl('open', 'Nova Página');
 smcore.prototype = new SmAjax();
 return smcore.prototype.postModal('insertpage', 'system/modules/action/editpage_v.php', 'modal-load');
 };

 /** ******************************************************
 * * @function : Executa o processo de postagem de
 * páginas a validação e feita em janela modal
 ** ******************************************************/
 var PostPage = function () {
 tinymce.triggerSave();
 modalControl('hiddenX');
 modalControl('open', 'Nova Página');
 smcore.prototype = new SmAjax();
 return smcore.prototype.postModal('insertpage', 'system/modules/action/postpage_v.php', 'modal-load');
 };

 /** ******************************************************
 * * @function : Exibe em tela cheia o que foi postado
 * como página.
 * * @Info : Essa função não salva páginas.
 ** ******************************************************/
 var PreviewPage = function () {
 tinymce.triggerSave();
 smcore.prototype = new SmAjax();
 return smcore.prototype.postAjax('insertpage', 'system/modules/action/previewpage_v.php', 'preview');
 };

  

	 

	Não vou postar a Classe JS do ajax por ser muito grande e por ter certeza que o problema não é esse.

	 

	Se precisar de mais informações é só dizer...

	Mas meu problema é esse quando abro o arquivo de edição via ajax o tinymce abre normalmente para edição com a texteare no valor correto, mas na hora de salva não salva o conteúdo editado e sim o conteúdo antigo.

	Olhando no ferramenta de inspeção do navegador, notei que o mesmo não altera o valor da antiga textarea daí o motivo.

	Então tentei pegar o valor inserido o nome conteúdo do tiny e re-escrever a antiga textearea com o mesmo valor, mas mesmo assim não funcionou.

var textarea = document.querySelector('.mcepaste');
var tValue = tinyMCE.get('pagecontent').getContent();
textarea.value = tValue;

	**.mcepaste** : é o div class da textarea

	**pagecontent** : é name da textarea

	 

	Mas nem tudo é tão fácil, surgiu outro problema, e eu abrisse via ajax o arquivo e o editasse seu conteúdo, logo então ir a outro arquivo e tentar editar o valor inserido era o mesmo da edição anterior.

	Putz memória alocada?!

	Fui novamente a ferramenta de inspeção e notei que a cada ajax executado o tinymce levava mais MS para carregar, o que comprovou o que imaginava, toda vez que abria um ajax um novo edior era mantido na memória sem excluir o anterior.

	O que fui simples resolver, bastasse que eu removesse todos os dados antigos antes de iniciar uma nova instância do editor.

	 

	Ficando assim o arquivo JS que abre junto com os arquivos via ajax.

 Spoiler

var tinymce = tinymce || {};

});

  

	 

	 

	Nota.:

	O importante é isso, antes de iniciar o editor tinymce  certificar de ter eliminado todos os dados dele já criado.

	O javascript postado lá em cima que pega os valores, deve ser executado antes do salvamento via ajax.

	 

	No mais se tiver o mesmo problema é só fazer isso que poderá mexer com esse editor tranquilamente com requisições por ajax, sendo GET ou POST.