Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá!!!
Pessoal preciso fazer com q o update reorganize uma ordem numérica.
Envio somente aquele que mudou de ordem.
Envie todos já com a nova ordem. Vai te facilitar muito o trabalho.
A ideia é boa, poderia ser algo com jquery...
imagino q atraves de campos form option, atualizando onchange...
como poderia ser isso em js, tem noção?
Isso vai depender de como você realiza a edição da ordem.
Imaginei em carregar todos da coluna ordem em form select, cada registro em seu select. De 1 a 10 por exemplo.
Então quando quando mudar '.change()' o que tá em 2 pra 3, todos mudarem sua ordem automatica. E quando salvar, realizar o update em todos já ordenados.
Saberia fazer isso em jquery?
...ou pensa em alguma outra forma, diz aí..?
O digitar a ordem é muito subjetivo, faça algo para mover as linhas.
Pronto tem este: https://jqueryui.com/sortable/
Ou construa algo próprio somente com javascript.
>
O digitar a ordem é muito subjetivo, faça algo para mover as linhas.
Pronto tem este: https://jqueryui.com/sortable/
Ou construa algo próprio somente com javascript.
Oi,
gostei desse:
<ul id="sortable">
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 5</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 6</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 7</li>
</ul>
Mas como poderia fazer para que o fosse registrado no banco de dados a posição que escolhi..?
por exemplo, arrastei o item1 pra segunda posição, então clico em salvar..
Coloque dentro de um formulário com input hidden e utilize os inputs como array, conforme o exemplo no link abaixo:
O PHP receberá conforme a ordem que você definiu.
>
Coloque dentro de um formulário com input hidden e utilize os inputs como array, conforme o exemplo no link abaixo:
O PHP receberá conforme a ordem que você definiu.
To tentando montar:
<meta charset="utf-8">
<?php
require("oraculo/conecta/conecta.php");
//require "../oraculo/sessions/session.php";
require "oraculo/sql/sql_global.php";
?>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Sortable - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<style>
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
#sortable li span { position: absolute; ; }
</style>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#sortable" ).sortable();
$( "#sortable" ).disableSelection();
} );
</script>
</head>
<body>
<ul id="sortable">
<?php
while($row = mysql_fetch_array($rs_ordenador)){
$id = $row['id'];
$titulo = $row['titulo'];
$ordem = $row['ordem'];
?>
<li class="ui-state-default">
<form>
<input type="hidden" name="ordem[]" value="<?php echo $ordem; ?>">
</form>
<span class="ui-icon ui-icon-arrowthick-2-n-s"></span>
<?php echo $titulo; ?>
</li>
<?php
}//end while
?>
<button type="submit">Salvar</button>
</ul>
</body>
</html>
To no caminho certo?
caso sim..agora preciso fazer o script de update... ajuda?
Uma vez eu fiz assim, mas faz tempo
Criei o atributo date-id que é id auto-increment
<tr data-id="9"></tr>
<tr data-id="10"></tr>
<tr data-id="11"></tr>
Conforme atualiza as posições pego sequencia conforme arvore DOM.
$(this.elemento_nome)[i].getAttribute('data-id')
Depois envio as posições separado por virgula que são as IDs, já no php dou explode na virgula, criando o array, depois percorro com foreach e uso o indice "$key" para gerar as novas posições de 0 a *, na coluna order sempre vai ser default 0, fiz isso para ordenar imagem de produto.
Exemplos tem de KG na internet, o esquema ae é só o php mesmo, que é usar a ID e o indice do array que se inicia com a posição zero.
>
Uma vez eu fiz assim, mas faz tempo
Criei o atributo date-id que é id auto-increment
<tr data-id="9"></tr>
<tr data-id="10"></tr>
<tr data-id="11"></tr>
Conforme atualiza as posições pego sequencia conforme arvore DOM.
$(this.elemento_nome)[i].getAttribute('data-id')
Depois envio as posições separado por virgula que são as IDs, já no php dou explode na virgula, criando o array, depois percorro com foreach e uso o indice "$key" para gerar as novas posições de 0 a *, na coluna order sempre vai ser default 0, fiz isso para ordenar imagem de produto.
Exemplos tem de KG na internet, o esquema ae é só o php mesmo, que é usar a ID e o indice do array que se inicia com a posição zero.
Gostei da ideia.. mas ainda fiquei perdido...
Imagino uma forma de fazer que seria mais simples, assim:
vou tentar iniciar o codigo:
<?php
require "conecta.php";
$id_produto_escolhido = $_POST['id'];
$ordem_escolhida = $_POST['ordem'];//essa é a ordem q o usuario escolheu para determinado produto
$up_escolhido = "UPDATE produtos SET ordem = '$ordem_escolhida' WHERE id = '$id_escolhido'";
$rs_escolhido = mysql_query($up_escolhido);
$seleciona_ordem_igual = "SELECT * FROM tabela WHERE ordem='$ordem_escolhida'";
$rs_ordem_igual = mysql_query($seleciona_ordem_igual );
while($row = mysql_fetch_array($rs_ordem_igual)){
$ordem = $row['ordem'];
}
###########Agora nessa parte teria que fazer um update com +1,
###########começando por aquele que tem a ordem igual a escolhida até o produto($id_produto_escolhido)
###########que foi selecionado para mudar de posição. Imagino que seja necessário um for aqui para isso,
###########peço ajuda aí..
?>
Segue Boy, entenda a lógica por trás do Sortable
>
Segue Boy, entenda a lógica por trás do Sortable
https://www.youtube.com/watch?v=3mOs0VY_sIw
Oi williams, vou ver com calma...
...Enquanto isso, olha como to tentando:
<meta charset="utf-8">
<?php
require("oraculo/conecta/conecta.php");
//require "../oraculo/sessions/session.php";
require "oraculo/sql/sql_global.php";
?>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ordenar</title>
<link rel="stylesheet" href="css/global.css">
</head>
<body>
<?php
while($row = mysql_fetch_array($rs_ordenador)){
$id = $row['id'];
$titulo = $row['titulo'];
$ordem = $row['ordem'];
?>
<li>
<?php echo $titulo; ?>
<form method="post" action="oraculo/form-operation/update/up-ordem.php">
<label></label>
<select name="ordem">
<option value="<?php echo $ordem; ?>" ><?php echo $ordem; ?></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<button>Salvar</button>
<input type="hidden" name="id" value="<?php echo $id; ?>">
</form>
</li>
<?php
}//end while
?>
</body>
</html>
- E o update estou fazendo assim:
<meta charset="utf-8">
<?php
require "../../conecta/conecta.php";
$id = $_POST['id'];
$ordem_escolhida = $_POST['ordem'];
$up_igual = "UPDATE ordenador SET ordem = ordem+1 WHERE id != '$id'";
$rs_igual = mysql_query($up_igual);
$up_escolhido = "UPDATE ordenador SET ordem = '$ordem_escolhida' WHERE id = '$id'";
$rs_escolhido = mysql_query($up_escolhido);
header("location:../../../index.php");
?>
e agora...??? como resolver...
>
e agora...??? como resolver...
Fazendo da forma correta e evitando Gambiarras, assista o vídeo que passei.
Fazendo da forma correta e evitando Gambiarras, assista o vídeo que passei.
hshs.. sim, quero fazer da forma certa sem gambiarra... estou pensando no código pra isso..
vou assistir...
assisti o video, mas ainda não me resolveu...
com esse codigo tá quase.. se alguem conseguir complementar me avisa aí:
<meta charset="utf-8">
<?php
require "../../conecta/conecta.php";
$id = $_POST['id'];
$ordem_escolhida = $_POST['ordem'];
$up_igual = "UPDATE ordenador SET ordem = ordem+1 WHERE id != '$id'";
$rs_igual = mysql_query($up_igual);
$up_escolhido = "UPDATE ordenador SET ordem = '$ordem_escolhida' WHERE id = '$id'";
$rs_escolhido = mysql_query($up_escolhido);
header("location:../../../index.php");
?>Acabei tentando de mais uma forma.. e agora com um sortable..
o codigo a seguir veio assim:
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link href="[https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css](https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css)" rel="stylesheet" integrity="sha256-MfvZlkHCEqatNoGiOXveE8FIwMzZg4W85qfrfIFBfYc= sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha256-Sk3nkD6mLTMOF0EOpNtsIry+s1CsaqQC1rVLTAy+0yc= sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
<title>mySQL sortable</title>
<script type="text/javascript">
$(document).ready(
function(){
$("#sortable").sortable({
update: function(){
$.ajax({
url: "save.php",
type: "POST",
data: $("#sortable").sortable("serialize"),
error: function(){
alert("There was an error while sending.");
}
});
}
});
}
);
</script>
</head>
<body>
<div class="container">
<ul class="list-group" id="sortable">
<?php
require("oraculo/conecta/conecta.php");
require "oraculo/sql/sql_global.php";
$res = mysql_query("SELECT text, id FROM sortable ORDER BY position ASC");
while ($row = mysql_fetch_row($res)) {
echo '<li class="list-group-item" id="sortable_'.$row[1].'">'.$row[0].'</li>';
}
?>
</ul>
</div>
</body>
</html>
save.php
<?php
require "conecta/conecta.php";
$sortable = $_POST["sortable"];
for ($i = 0; $i < count($sortable); $i++) {
mysql_query("UPDATE sortable SET position = '".$i."' WHERE id = '".$sortable[$i]."'");
}
?>
Me pareceu bem compreensivel de implementar..
mas quando atualizo o navegador, não mantem a ordem salva..
https://www.youtube.com/watch?v=sxEMvA0ZCcg
alguem consegue entender aí?
Você envia todos os dados novamente para update? Ou apenas quele que mudou de ordem?