Front-end development jq+php Click the up and down button to modify the sorting
1. Front-end code:
2. By jq load html
$(".edit_up").each(function() {
var id = $(this).attr('attr_id');//Get the submitted id
var url=$(this).attr('attr_url');//Get the submission address
var html = '
$(this).html(html);
});
The front end has the style as shown in the figure (specific style is customized):
three. Jq Submit the background and change the order of the list
function edit_order(obj, t, id,url) {
var to = $(obj).attr("attr-to");//Get up or down
var url = url + "?&i=" + id +"&to=" + to + "&ajaxedit=1";//Submit address;
var that=$(obj)
$.ajax({
url: url,
cache: false,
success: function(val) {
val = $.trim(val);
if(val>0){//Backend value
if (to == 'down' && val>0) {
var partentsDiv =that.parents('tr')//Get the parent
var next = partentsDiv.next();//Get the next parent
if(next.html() !== undefined){
next.fadeOut('slow',function(){
$(this).after(partentsDiv);
}).fadeIn()
}else{//
layer.msg('It's the end' )//The last one on the current page, if there is a paging, you can change the data by refreshing the page
}
}else{
var parentDiv = that.parents('tr');//Get the parent
var prev = parentDiv.prev()//Get the previous parent
if(prev.html() !== undefined){
prev.fadeOut('slow',function () {
$(this).before(parentDiv)
}).fadeIn()
}else{
layer.msg('It's up to the top' ) //It is already the first page. If there is a paging, you can change the data by refreshing the page.
}
}
}else{
if(to == 'down'){
layer.msg('It's the end' ) //Already the last
}else{
layer.msg('It's up to the top' ) //Already the first
}
}
}
});
}
Before clicking:
4. Change the sort number of data in the background. My idea is to save it. id Save as sorting number, change the sorting by changing the two sorting numbers.
Background code:
public function site_order(){
$id=I('i');
$to=I('to');
$ModelObj = $this->ModelObj;
$old=$ModelObj->field('order_id,parent_id')->where(array('category_id'=>$id))->find();
if($to=='down'){
$new=$ModelObj->where(array('status'=>1,'parent_id'=>$old['parent_id'],'order_id'=>array('lt',$old['order_id'])))->order('order_id desc')->find();
}
if($to=='up'){
$new=$ModelObj->field('order_id,category_id')->where(array('status'=>1,'parent_id'=>$old['parent_id'],'order_id'=>array('gt',$old['order_id'])))->order('order_id')->find();
}
if($new){
$ModelObj->where(array('category_id'=>$new['category_id']))->setField('order_id',$old['order_id']);
$res=$ModelObj->where(array('category_id'=>$id))->setField('order_id',$new['order_id']);
}
$this->ajaxReturn($res);
}
}
Just find out the sort numbers of the two data when up or down
My sorting is from large to small
When all downwards, find the largest number of data smaller than this sort number.
On the contrary, find the smallest one in the sort number data.
The above is the "front-end development shared by Suyou Network with everyone jq+php Click the up and down button to modify the sorting. Thank you very much for your patience to read this article. We will provide you with more information on reference, use or learning and communication.We can also provide you with:Enterprise website construction, website imitation, website copying, imitation site, foreign trade website construction, foreign trade website construction, company official website productionFor services, our company serves customers with the service concept of "integrity, professionalism, pragmatism and innovation".If you need cooperation, please scan the code to consult, and we will serve you sincerely.
TAG Label:
Previous article:How to design dolls for corporate websites?
Next article:Clever: What parts does a corporate website include?
