Revision: 36063
Updated Code
at September 29, 2011 22:33 by housecor
Updated Code
$("#sortable").sortable({
cursor: 'move',
placeholder: 'ui-state-highlight team-img-placeholder',
revert: true,
forcePlaceholderSize: true,
tolerance: 'intersect',
axis: 'y',
forceHelperSize: true
});
$("#sortable").disableSelection();
//And to store the sorted ids:
var sortedProviders = $('#ProviderList').sortable('toArray');
//OR, if each <li> has a name along with a number for its ID:
var priorities = $('#pricing-rule-priority').sortable('toArray');
for (var i = 0; i < priorities.length; i++) {
priorities[i] = priorities[i].replace(/segment-/g, '');
}
$.ajax({
type: "POST",
url: "/Admin/Providers/Manage.aspx/SaveDisplayOrder",
data: "{providerIDs: '" + sortedProviders.join() + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
$('#pnlUploadLogo').slideDown();
if (msg.d != "true") alert('There was an error deleting the logo.');
}
});
//CSS:
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; cursor:move;}
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; }
#sortable li span { position: absolute; margin-left: -1.3em; }
.team-img-placeholder {height:100px;}
//Repeater:
<asp:Repeater ID="rptTeamMembers" runat="server">
<HeaderTemplate><ul id="sortable"></HeaderTemplate>
<ItemTemplate>
<li><span class="ui-icon ui-icon-arrowthick-2-n-s"></span><img src="/Images/Team/<%#DataBinder.Eval(Container.DataItem, "Photo")%>" alt="<%#DataBinder.Eval(Container.DataItem, "Name")%>" title="<%#DataBinder.Eval(Container.DataItem, "Name")%>" class="team_member_photo" /> <label><%#DataBinder.Eval(Container.DataItem, "Name")%></label></li>
</ItemTemplate>
<FooterTemplate></ul></FooterTemplate>
</asp:Repeater>
Revision: 36062
Updated Code
at December 4, 2010 05:12 by housecor
Updated Code
$("#sortable").sortable({
cursor: 'move',
placeholder: 'ui-state-highlight team-img-placeholder',
revert: true,
forcePlaceholderSize: true,
tolerance: 'intersect',
axis: 'y',
forceHelperSize: true
});
$("#sortable").disableSelection();
//And to store the sorted ids:
var sortedProviders = $('#ProviderList').sortable('toArray');
$.ajax({
type: "POST",
url: "/Admin/Providers/Manage.aspx/SaveDisplayOrder",
data: "{providerIDs: '" + sortedProviders.join() + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
$('#pnlUploadLogo').slideDown();
if (msg.d != "true") alert('There was an error deleting the logo.');
}
});
//CSS:
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; cursor:move;}
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; }
#sortable li span { position: absolute; margin-left: -1.3em; }
.team-img-placeholder {height:100px;}
//Repeater:
<asp:Repeater ID="rptTeamMembers" runat="server">
<HeaderTemplate><ul id="sortable"></HeaderTemplate>
<ItemTemplate>
<li><span class="ui-icon ui-icon-arrowthick-2-n-s"></span><img src="/Images/Team/<%#DataBinder.Eval(Container.DataItem, "Photo")%>" alt="<%#DataBinder.Eval(Container.DataItem, "Name")%>" title="<%#DataBinder.Eval(Container.DataItem, "Name")%>" class="team_member_photo" /> <label><%#DataBinder.Eval(Container.DataItem, "Name")%></label></li>
</ItemTemplate>
<FooterTemplate></ul></FooterTemplate>
</asp:Repeater>
Revision: 36061
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at November 17, 2010 14:08 by housecor
Initial Code
$("#sortable").sortable({
cursor: 'move',
placeholder: 'ui-state-highlight team-img-placeholder',
revert: true,
forcePlaceholderSize: true,
tolerance: 'intersect',
axis: 'y',
forceHelperSize: true
});
$("#sortable").disableSelection();
//CSS:
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; cursor:move;}
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; }
#sortable li span { position: absolute; margin-left: -1.3em; }
.team-img-placeholder {height:100px;}
//Repeater:
<asp:Repeater ID="rptTeamMembers" runat="server">
<HeaderTemplate><ul id="sortable"></HeaderTemplate>
<ItemTemplate>
<li><span class="ui-icon ui-icon-arrowthick-2-n-s"></span><img src="/Images/Team/<%#DataBinder.Eval(Container.DataItem, "Photo")%>" alt="<%#DataBinder.Eval(Container.DataItem, "Name")%>" title="<%#DataBinder.Eval(Container.DataItem, "Name")%>" class="team_member_photo" /> <label><%#DataBinder.Eval(Container.DataItem, "Name")%></label></li>
</ItemTemplate>
<FooterTemplate></ul></FooterTemplate>
</asp:Repeater>
Initial URL
Initial Description
Initial Title
JqueryUI sortable init/config call
Initial Tags
Initial Language
jQuery