Editei a pergunta do post pois considero ser a solução mais lógica para a questão. Tenho uma páginas com 3 tabs e em uma dessas faço um upload de arquivos para a minha hospedagem e envio as informações necessárias ao banco de dados, monto uma tabela html com os registros que acabei de cadastrar para exibir ao usuário mas a página não é atualizada, gostaria de poder ao cadastrar voltar a página mostrar uma tabela com os dados cadastrados, sempre sendo atualizada a cada nova inserção e se possível na aba de origem do cadastro, não consegui encontrar nem exemplo que pudesse me ajudar.
Algo parecido com esse post: https://stackoverflow.com/questions/16707648/using-jquery-ajax-to-retrieve-data-from-mysql
O que tenho é isso no retorno do upload:
header('Content-Type: application/json'); echo json_encode($aretorno);
E nome da TAB é:
<div class="tab-pane" id="panel-2">
Script que envio o Upload e seu retorno:
// INICIA O UPLOADO DO ARQUIVO
$(document).ready(function() {
function getDoc(frame) {
var doc = null;
// IE8 cascading access check
try {
if (frame.contentWindow) {
doc = frame.contentWindow.document;
}
} catch (err) {}
if (doc) { // successful getting content
return doc;
}
try { // simply checking may throw in ie8 under ssl or mismatched protocol
doc = frame.contentDocument ? frame.contentDocument : frame.document;
} catch (err) {
// last attempt
doc = frame.document;
}
return doc;
}
$("#multiform").submit(function(e) {
$("#multi-msg").html('<img src="../_imagens/ajax-loader.gif" alt="Enviando..." />');
var formObj = $(this);
var formURL = formObj.attr("action");
if (window.FormData !== undefined) // for HTML5 browsers
// if(false)
{
var formData = new FormData(this);
$.ajax({
url: formURL,
type: 'POST',
data: formData,
mimeType: "multipart/form-data",
contentType: false,
cache: false,
processData: false,
success: function(data, textStatus, jqXHR) {
$("#multi-msg").html('<pre><code>' + data + '</code></pre>');
},
error: function(jqXHR, textStatus, errorThrown) {
$("#multi-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus=' + textStatus + ', errorThrown=' + errorThrown + '</code></pre>');
}
});
e.preventDefault();
e.unbind();
} else //for olden browsers
{
//generate a random id
var iframeId = 'unique' + (new Date().getTime());
//create an empty iframe
var iframe = $('<iframe src="javascript:false;" name="' + iframeId + '" />');
//hide it
iframe.hide();
//set form target to iframe
formObj.attr('target', iframeId);
//Add iframe to body
iframe.appendTo('body');
iframe.load(function(e) {
var doc = getDoc(iframe[0]);
var docRoot = doc.body ? doc.body : doc.documentElement;
var data = docRoot.innerHTML;
$("#multi-msg").html('<pre><code>' + data + '</code></pre>');
});
}
});
$("#multi-post").click(function() {
$("#multiform").submit();
});
});
PHP que insere dados no BD:
require_once("../_connections/pcon.php"); require_once("../_comp/internos/funcoes.php"); //Array que irá retornar o status da execução do script (JSON) $aretorno = array(); $aretorno["msg"] = ""; $aretorno["status"] = ""; @$conn = new mysqli($hostname_pcon, $username_pcon, $password_pcon, $database_pcon); // Checar conexão if ($conn->connect_errno) { $aretorno["msg"] = "Conexão ao banco de dados falhou."; $aretorno["status"] = "ERRO"; header('Content-Type: application/json'); echo json_encode($aretorno); exit; } if (!$conn->set_charset("utf8")) { $aretorno = array(); $aretorno = "Erro ao carregar conjunto de caracteres utf8."; header('Content-Type: application/json'); echo json_encode($aretorno); exit; } // RESGATE DAS VARIÁVEIS $IdContrato = $_POST["IdContrato"]; $Observacao = $_POST["Observacao"]; $DataHora = date('Y-m-d H:i:s'); // REGISTRO DO LOG $dataAgora = date('d/m/Y'); $hora = date("H:i:s"); $partes = explode("/", $dataAgora); $dia = $partes[0]; $mes = $partes[1]; $ano = $partes[2]; // DIRETÓRIO $diretorio = 'upload/'; if (!empty($_FILES)) { $ArquivoTemporario = $_FILES['arquivo']['tmp_name']; $NomeArquivo = $_FILES['arquivo']['name']; $CaminhoAnexo = dirname(__FILE__) . '/' . $diretorio; $targetFile = rtrim($CaminhoAnexo,'/') . '/' . $_FILES['arquivo']['name']; $TipoArquivo = strtolower(pathinfo($NomeArquivo, PATHINFO_EXTENSION)); $Caminho = $diretorio; // Validate the file type $fileTypes = array('jpg','jpeg','gif','png','pdf','doc','docx','xls','xlsx'); // File extensions $fileParts = pathinfo($_FILES['arquivo']['name']); if (in_array($fileParts['extension'],$fileTypes)) { move_uploaded_file($ArquivoTemporario,$targetFile); } else { echo 'Tipo de Arquivo invalido'; exit; } } // COMPONDO O LOG $Log = $_SESSION['u_login']."_".$dia.$mes.$ano."_".$hora; $Usuario = 'Valter'; $sql = "INSERT INTO gerDoctoContrato ( IdContrato, NomeArquivo, TipoArquivo, CaminhoAnexo, Usuario, DataHora, Observacao, Log ) VALUES ( ?, ?, ?, ?, ?, ?, ?, ?)"; // Preparar os dados: // i corresponde a uma variável de tipo inteiro // d corresponde a uma variável de tipo double // s corresponde a uma variável de tipo string // b scorresponde a uma variável que contém dados para um blob e enviará em pacotes if($stmt = $conn->prepare($sql) ){ $stmt->bind_param( "ssssssss", // RESGATE DAS VARIÁVEIS $IdContrato, $NomeArquivo, $TipoArquivo, $Caminho, $Usuario, $DataHora, $Observacao, $Log ); // DESLIGA O AUTO COMMIT // $conn->autocommit(false); // INSERINDO REGISTRO NO BD if ($stmt->execute()) { $aretorno["msg"] = "Registro inserido com sucesso."; } else { $aretorno["msg"] = "Ocorreu um erro na inclusão dos dados:". $stmt->error ." Verifique"; $aretorno["status"] = "ERRO"; } } else { $aretorno["msg"] = "Ocorreu um erro na preparação dos dados: " . $stmt->error . ". Verifique."; $aretorno["status"] = "ERRO"; } // FECHA CONEXÃO COM BD $conn->close(); //retornando o status / mensagem da execução header('Content-Type: application/json'); echo json_encode($aretorno);
Não sei exatamente o que postar para exemplificar o que já tenho.