Updating database with php/ajax/jquery

@Aur1clesJul 31.2012

I am using Jquery sortable, but I’m not able to update the database with the position user has chosen, maybe somebody can help me ?

Here is jquery and ajax :

[CODE]$(function () { $(‘.drag’).sortable({ connectWith: ‘.drag’, update : function(e, ui) { var id=$(this).attr(‘id’); var ul = $(ui.item).closest(‘.drag’); var index = 0; var toPost = {}; ul.find(‘> li’).each(function() { index++; $(this).find(‘input’).val(index); toPost[$(this).find(‘input’).attr(‘name’)] = index; }); $.ajax({ url : ‘UpdateLink.php’, data : id, type : ‘POST’, dataType : ‘json’, success : function(resp) { alert(resp); }, error : function() { alert(‘There was a problem’); } }); } }); });[/CODE]

HTML and some PHP :

[code=html]<ul style=”list-style-type: none;” class=”drag”><li> <input type=”hidden” value=”sortNO_<?php echo $lingi_sort_no; ?>” /> <input type=”hidden” name=”<?php echo $title_id; ?>”><a href=”<?php echo $lingi_aadress; ?>”><?php echo $lingi_nimi;?></a> </li></ul>[/code]

PHP that I want to get updating the database

[code=php]foreach($_POST[‘id’] as $title_id => $order) { $sql = “UPDATE db_links SET title_id = ‘$title_id’ WHERE id = ‘$order'”; mysql_query($sql) or die (mysql_error()); }[/code]

I need to update two values in database: $lingi_sort_no and $title_id. I would appreciate some help

to post a comment

PHP

2 Comments(s) _↴

@MekatekAug 11.2012 — #

[code=html]
 
 //The UL List
 /*
 <ul>
 <li>
 <input type="hidden" name="" value="<?php echo $value1;?>" class="first"/>
 <input type="hidden" name="" value="<?php echo $value2;?>" class="second"/>
 <a></a>
 </li>
 </ul>
 
 */
 
 
 $(function () {
 $('.drag').sortable({
 connectWith: '.drag',
 update : function(e, ui) {
 
   var index = 0;
   var _data = []; // array of values
   ul.find('> li').each(function() {
 
   index++; 
   var _val1 = $(this).find('input.first').val();
   var _val2 = $(this).find('input.second').val();
 
   var _str = index+','+val1+','+val2; // save data as comma separated string
 
   _data.push(_str);
 
   });
 
   //Conver array of data to string to send it to php
   var data = _data.join(';'); //this will create a string like this  data='index1,data1,data2;...;indexn,datan1,datan2'
 
   //You dont need dataType json if you only spect a confirmation from php
   $.ajax({
   url : 'UpdateLink.php',
   data : 'data='+data,
   type : 'POST',
   success : function(data,status) {
 
   if(status == 'success'){
   alert(data);
   }
 
   },
   error : function() {
   alert('There was a problem');
   }
   });
  }
 
  });
 });
 
 //The PHP file
 
 <?php 
 
  $data = $_POST['data'];
 
  //Create first array
  $items = explode(';',$data); // This create the first array with avery item from the UL
 
  foreach($items as $item){
 
   $values = explode(',',$item); // This create the second array to separate the values
 
   $id = $values[0]; // The order of the li item from the ul list
   $title = $values[1]; //The title of the item, Here is better to use the unique id of your table
 
 
   //I changed the MySQL sentence, but I think you need a unique id to refer to, instead the title
 
   $sql = "UPDATE db_links SET order ='$id' WHERE title_id= '$title'"; 
   mysql_query($sql) or die (mysql_error());
  }
 
 ?> 
 
 
 [/code]

@MekatekAug 11.2012 — #hi again and sorry is all messed up.

Cleaning the post you can try this

This is the HTML code for your UL list:

[code=html]
 <ul>
 <li>
 <input type="hidden" name="" value="<?php echo $value1;?>" class="first"/>
 <input type="hidden" name="" value="<?php echo $value2;?>" class="second"/>
 <a></a>
 </li>
 </ul>
 [/code]

This is the javascript code:

[CODE]
 
 $(function () {
 $('.drag').sortable({
 connectWith: '.drag',
 update : function(e, ui) {
 
   var index = 0;
   var _data = []; // array of values
   ul.find('> li').each(function() {
 
   index++; 
   var _val1 = $(this).find('input.first').val();
   var _val2 = $(this).find('input.second').val();
 
   var _str = index+','+val1+','+val2; // save data as comma separated string
 
   _data.push(_str);
 
   });
 
   //Conver array of data to string to send it to php
   var data = _data.join(';'); //this will create a string like this  data='index1,data1,data2;...;indexn,datan1,datan2'
 
   //You dont need dataType json if you only spect a confirmation from php
   $.ajax({
   url : 'UpdateLink.php',
   data : 'data='+data,
   type : 'POST',
   success : function(data,status) {
 
   if(status == 'success'){
   alert(data);
   }
 
   },
   error : function() {
   alert('There was a problem');
   }
   });
  }
 
  });
 });
 
 [/CODE]

And finally the PHP code:

[code=php]
 <?php 
 
  $data = $_POST['data'];
 
  //Create first array
  $items = explode(';',$data); // This create the first array with avery item from the UL
 
  foreach($items as $item){
 
   $values = explode(',',$item); // This create the second array to separate the values
 
   $id = $values[0]; // The order of the li item from the ul list
   $title = $values[1]; //The title of the item, Here is better to use the unique id of your table
 
 
   //I changed the MySQL sentence, but I think you need a unique id to refer to, instead the title
 
   $sql = "UPDATE db_links SET order ='$id' WHERE title_id= '$title'"; 
   mysql_query($sql) or die (mysql_error());
  }
 
 ?> 
 [/code]

I hope this will help you out.

Also in #PHP _↴

Multiple Logins, Download (with limit)Mysqli issue account login issue GD Library

Success!

Help @Aur1cles spread the word by sharing this article on Twitter...

Tweet This

Updating database with php/ajax/jquery

2 Comments(s) _↴

Also in #PHP _↴

Success!

Social

Version

Updating database with php/ajax/jquery

2 Comments(s) ↴

Also in #PHP ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

2 Comments(s) _↴

Also in #PHP _↴