webmaster programmatore php mysql java javascript

Web Developer

PROGRAMMAZIONE JQUERY JQuery Gestire Ordinamento DIV e salvarlo in MySql
./image/upload/05-05-2017-08-32-18.jpg

foto-1

In questi giorni volevo sperimentare qualcosa di nuovo e sono incappato nell'utilizzo di funzioni drag&drop di JQuery.

Questa funzione di JQuery è molto semplice da integrare ed utilizzare, ma se provassimo a salvare il risultato?

Esempio
Dai agli utenti del tuo sito la possibilità di ordinare a loro piacimento i box della home page(e questo lo fai con JQuery sortable), ma hai bisogno che il risultato del loro ordinamento sia disponibile sempre.

Ecco come fare

<script>
$( function() {
$( ".sortable" ).sortable();
$( ".sortable" ).disableSelection();
} );
</script>

<ul class="sortable">
<li class="mia_nota">1</li>
<li class="mia_nota">2</li>
<li class="mia_nota">3</li>
<li class="mia_nota">4</li>
<li class="mia_nota">5</li>
<li class="mia_nota">6</li>
</ul>

In questo modo avrai creato dei semplici box che il tuo visitatore potrà ordinare come vuole.

Salvare queste informazioni in una tabella

Dopo aver fatto l'ordinamento con il drag & drop il JQuery invierà un array alla pagina salva_ordinamento.php.

<script>
$(function() {
$(".sortable").sortable({
connectWith: '.sortable',
update: function(event, ui) {
var changedList = this.id;
var order = $(this).sortable('toArray');
var positions = order.join(';');

$.ajax({
data: "positions=" + positions,
type: 'GET',
url: 'salva_ordinamento.php',
success: function(data) {
alert("Saved");
}
});
}
});

$(".sortable").disableSelection();
});
</script>


Buon Web a tutti

Developer - Problem Solver - Business Intelligence

Panthera ERP Biella

Programmatore Html - Css Biella

Programmatore Javascript - Jquery Biella

Programmatore PHP Biella

Programmatore SQL Biella

Programmatore Web app Biella

Programmatore Web Biella

Realizzazione Dashboard Personalizzate Biella

Soluzioni B.I. con Qlik View e Qlik Sense Biella

Sviluppo Reportistica Crystal Report Biella

Webmaster Biella

Programmatore web - Webmaster Elio Curtacci
Made with made in italy in Italy
Questo sito web utilizza i COOKIE per dare all'utente un'esperienza di visita migliore.

LOG-IN