function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Just Code ItJust Code It 

Drag-and-Drop in Visualforce pageBlockTable

I need to be able to drop and drop row within a table in Visualforce, can anyone give a pointer on how to implement this functionality. I use "pageBlockTable" component. I tried using custom JavaScript but not able to get to  <TR> from what "pageBlockTable" generates. Thanks in advance.
SarfarajSarfaraj
Hi

I think you are looking something like this,
  
<apex:page controller="TheController">
    <apex:stylesheet value="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css"/>
    <apex:includeScript value="//code.jquery.com/jquery-1.10.2.js"/>
    <apex:includeScript value="//code.jquery.com/ui/1.11.2/jquery-ui.js"/>
    <script>
        $(document).ready(function(){
            $(document.getElementById("{!$Component.theForm.thePageBlock.theTable}")).find("tbody").sortable();
        });
    </script>
    <apex:form id="theForm">
        <apex:pageBlock id="thePageBlock" >
            <apex:pageBlockTable value="{!accounts}" var="account" id="theTable">
                    <apex:column value="{!account.Name}"/>
                    <apex:column value="{!account.AccountNumber}"/>
                    <apex:column value="{!account.OwnerId}"/>
                    <apex:column value="{!account.Phone}"/>
                    <apex:column value="{!account.Fax}"/>
            </apex:pageBlockTable>
        </apex:pageBlock>        
    </apex:form>
</apex:page>
public with sharing class TheController {
    public List<Account> getAccounts()
    {
        return [Select Id, Name, AccountNumber, OwnerId, Phone, Fax From Account];
    }
}

--Akram
Mark RootMark Root
This works great, Akram, but how can I save the sorted results?  I've not been able to find any information about how to do this.  Thanks.

Mark.
Agent Comms 7Agent Comms 7
hi, this code working good.
but it is working in one section (means i can set the record in any place among all records), if i want to drag a single record from all records and want to drop it in a other page block section . how this will be possible?
please give me solution..
MLEMLE
Hello,

Very useful code but I can't save the sorted result.
I assume it's 2/3 lines of code but I can't find.

Anybody find the solution.

Thanks

Mat.
 
V TV T

I found one similar soution here with sample code.

https://salesforcetrail.blogspot.com/2020/04/drag-and-drop-show-and-hide-columns.html