Adding elements to a list

0

Good evening, I have an idea but I do not know how to do it. I'm doing a ordering system , where a client will be selected and its requests , and the most correct way I thought of doing this was to have the user add the requests in a list, but then the problem comes up, I can not think of a way for the list to be completed without the page being reloaded . In short, when the user clicks "OK" , a new order would be added to the table on the same page, without being reloaded.

    
asked by anonymous 28.06.2017 / 05:34

2 answers

1

This you should do with ajax and jquery friend. When the person clicks, it adds the data in the div:

$(".adicionar").click(function(){
$.ajax({
type: 'POST',
url: 'resultado.php',
success: function(data) {
$(".tabela").append(data);
}
});
});

1) .add is the class you should add on a button in your HTML.

2) resultado.php is the file that does the SQL query and returns the data. You can use echo .

3) .table is the class you should add in the div that will display the table.

    
28.06.2017 / 05:59
1

Try using Ajax and COOKIES, you create a PHP file that adds the requests to the list (which would be the cookie) and puts a javascript function that calls this file via ajax on the "OK" button , takes the response from the XML file and adds it to the page with JS.

Example of how I used it in a project:

PHP:

<?php // Página que adiciona os produtos no carrinho    
    $id = $_GET['id'];  // ID do produto selecionado

    if (!isset($_COOKIE['carrinho'])) { // Verifica se o carrinho está vazio
        $carrinho = [0 => $id]; // A 1ª posição do array $carrinho (criado aqui) recebe o id do produto
        setcookie('carrinho', serialize($carrinho), time()+60*60*24*14, '/'); // Serializa o array no COOKIE carrinho
    } else {
        $carrinho = unserialize($_COOKIE['carrinho']); // Se não estiver vazio, cria um array com todos os produtos do carrinho
        $colocar = false; // Booleano que uso pra não repitir o mesmo produto

        // Checo se o produto selecionado já está no carrinho
        for ($i=0; $i < count($carrinho); $i++) { 
            if (!(in_array($id, $carrinho))) {
                $colocar = true;
            }
        }

        // Só adiciono ao carrinho se não tiver o produto nele ainda
        if ($colocar == true) {
            $carrinho[] = $id;
        }

        // Serializo o array dentro do COOKIE carrinho
        setcookie('carrinho', serialize($carrinho), time()+60*60*24*14, '/');
    }

    // Mando o número de produtos no carrinho como resposta, apenas para atualizar a tela do usuário
    echo count($carrinho);
?>

JS:

// Função que adiciona o produto no carrinho
function adicionarCarrinho(id) { 
	id = $(id).val(); // Pego o ID do produto como parâmetro (vc pode colocar o id no value do botão)
	
	AjaxRequest();

	if (!Ajax) {
		alert("Erro na chamada Ajax");
	} else {
		Ajax.onreadystatechange = respostaCarrinho;
		Ajax.open('GET', '_assets/ajax/adicionarCarrinho.php?id='+id); // Mando o ID para a página PHP por meio do Ajax
		Ajax.send(null);
		Ajax.close;
	}
}

// Função de resposta
function respostaCarrinho() {
	if (Ajax.readyState == 4) {
		if (Ajax.status == 200) {
			$("#itens").text(Ajax.responseText); // Mudo o valor escrito no carrinho
			if (Ajax.responseText == '0') {
				alert('Você não tem produtos no carrinho');
				window.location.href='index.php'
			}
		}
	}
}
    
28.06.2017 / 05:41