jquery - Send multiple AJAX data to PHP and update Mysql database -

i tying build application user can reorder items (and save order database). items user reordering navigation links, generated dynamically on page php loop:

$nav_links.='<li class="collection-item ui-state-default item" data-ord="'.$navorder.'" data-url="'.$pageurlname.'"><a>' .$pagename. '</a></li>';} 

$navorder order of page in navigation $pageurlname string used call page dynamically (index.php?page=$pageurlname) , unique key in table.

i using jqueryui sortable funcion make process drag & drop, working fine , each time reorder links, new order updated "data-ord".. sript:

    $('#sortable').sortable({     stop: function(event, ui){         $(".sortable li").each(function(i, el){                $(el).attr('data-ord',$(el).index()+1);         });     } }); 

now problem, ajax script:

$(document).on('click','.saveorder',function(){     var neworder = $('.collection-item').attr('data-ord');     var pgurl = $('.collection-item').attr('data-url');     $.ajax({         type:'post',         datatype:'text',         url:'/rs/pages/nav_order.php',         data: { neworder:neworder, pgurl:pgurl },         success: function(data) {console.log(data); $('#response').html(data);},          error: function(data) {console.log('error!', data); }            });      }); 

i new ajax, build on scripts found in other quiestions here. (i able succesfully implement cript link other functions) not working in case. problem seems trying post multiple data multiple rows (at time have 4 links trying reorder, link count can more or less). when tried values of variables "neworder" , "pgurl" (using alert), show values first item.

i have tried lot of solutions found in similar quiestion none of them worked, because user posting form data , serialized it, not case because not sending data form.

lastly here nav_order.php (i guess wrong here too, need add foreach @ first need have ajax working correctly):

<?php  include "/rs/include/db.php";  $neworder = $_post['neworder']; $pgurl = $_post['pgurl'];  $query = mysqli_query($connection, "update horus_pages set nav_order='$neworder' url_name='$pgurl'") or die (mysqli_error($connection)); echo 'reordered';  ?> 

also when check console, there no data.

so please can tell me how correct ajax script send data each object , handle correctly in php script? hope described problem clearly. thank help.

1. put data-id="your_database_id" in links html. selecting them in database href, slow , bug things if there multiple records same href.

2. you have save button sends order , href of first link finds? , happens when multiple items change order? if have many links, throwing hundreds of mysql updates each save?

3. you should better off sending json php. that:

   [{id:123, order: 332}, {id:124, order:334}, ... ]

   datatype:'text' becomes datatype:'json'

if don't care scalability, work on backend.

$data = file_get_contents("php://input"); $links = json_decode($data, true); foreach($links $link) {    $order = intval($link['order']);    $id = intval($link['id'])    // update table set `order` = '$order' id = '$id' } 

btw. php code allows sql injection. thats bad

4. perhaps can make order 'float' , make algorithm finds empty spot. allow reduce these 100's of sql requests 1.