我目前正在使用jQuery UI可排序的portlet和PHP,我需要能够获取每个portlet所在的数字位置并在移动时更新它。
第一个位置的portlet应该总是说Position 1
,而第二个位置的portlet应该总是说Position 2
。
技巧是我希望每次移动portlet时都更新它,以便第一个位置的portlet总是Position 1
,依此类推。这是因为我在这些portlet中移动唯一数据,而Position值将确定此信息在另一个页面上显示的优先级。
那么如何在每个portlet上获取并显示portlet位置,并在移动时更新它?
<script>
$(function() {
$( ".column" ).sortable({
connectWith: ".column",
handle: ".portlet-header",
cancel: ".portlet-toggle",
placeholder: "portlet-placeholder ui-corner-all"
});
$( ".portlet" )
.addClass( "ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" )
.find( ".portlet-header" )
.addClass( "ui-widget-header ui-corner-all" )
});
</script>
<?php
for($i = 0; $i < 6; $i++){
?>
<div class="portlet" id='portlet<?php echo $i; ?>'>
<div class="portlet-header">
<div>Position:<span id="value<?php echo $i; ?>"></span></div>
<script>
$(document).ready(function() {
var portletPosition = $('#portlet<?php echo $i; ?>').sortable("serialize");
$("#value<?php echo $i; ?>").html(portletPosition);
});
</script>
</div>
//Unique Portlet data
</div>
<?php
}
?>