Salesforce- Using jQuery to delete table rows using checkbox

Question

Right now the error I am getting is Invalid field checked for sObject People_Language__c.

Not sure if it doesn't like the use of the wrapper class or what but I don't see the problem.

Here is the Controller

public with sharing class myClass {

    public String pId                                   {get; set;}
    public list<Wrapper>pLanguages                      {get; set;}




    //CONSTRUCTOR
    public myClass(){
         pId = ApexPages.CurrentPage().getparameters().get('id');

         pLanguages = new List<Wrapper>();
             for ( People_Language__c pl : [SELECT Id, Language__c, Fluency__c FROM People_Language__c WHERE Person__c=:pId] ) {
               pLanguages.add(new Wrapper(pl));
             }
    }


public void deleteLanguage(){
    List<People_Language__c> langsToDelete = new List<People_Language__c>();
    for ( Integer i = 0; i < pLanguages.size(); i++ ) {
        if ( pLanguages[i].checked ) {
            langsToDelete.add(pLanguages.remove(i--).pl);
        }
    }
    delete langsToDelete;
}

    //WRAPPER
    public class Wrapper {
        public boolean checked {get; set;}
        public People_Language__c pl {get; set;}
    public Wrapper(People_Language__c pl) {
        this.pl = pl;
        this.checked = false; 
    }
}
}

visualforce

<apex:pageBlock title="Language" id="language"> 
    <apex:inputHidden id="delLanguage" value="{!languagesToDelete}"></apex:inputHidden> 
    <apex:pageBlockButtons location="top">       
         <apex:commandButton id="langNewBtn" value="{!$Label.New}" />
         <apex:commandButton id="LangDel" value="{!$Label.del2}" action="{!deleteLanguage}" rerender="language"/>
    </apex:pageBlockButtons>
    <apex:pageBlockTable value="{!pLanguages}" var="lang" title="People Language">
        <apex:column width = "25px">
            <apex:inputCheckbox value="{!lang.checked}" />
        </apex:column>
        <apex:column styleClass="actionColumn" width = "25px"> 
            <apex:facet name="header"> <apex:outputText value="Action" /> </apex:facet>
            <apex:outputLink styleClass="actionLink" target="_top">Del</apex:outputLink>
        </apex:column>
        <apex:column > 
            <apex:facet name="header"> <apex:outputText value="Language" /> </apex:facet>
            <apex:outputField value="{!lang.pl.Language__c}" />
        </apex:column>
        <apex:column > 
            <apex:facet name="header"> <apex:outputText value="Fluency" /> </apex:facet>
            <apex:outputField value="{!lang.pl.Fluency__c}" />
        </apex:column>
    </apex:pageBlockTable> 
</apex:pageBlock>

Answer 1

jQuery might be useful if you wanted to hide the rows from the page, but actually deleting them would need to be handled by your Apex controller. Probably the easiest way of doing this is by using a wrapper class in your controller, and then your deleteLanguage() method would be able to loop through and remove any records where the checkbox has been checked. jQuery isn't necessary for this approach.

A simple Apex controller using this approach:

public with sharing class PeopleLanguagesController {
    public String pId {get; set;}
    public List<Wrapper> pLanguages {get; set;}

    //CONSTRUCTOR
    public PeopleLanguagesController() {
        pId = ApexPages.CurrentPage().getparameters().get('id');
        pLanguages = new List<Wrapper>();
        for ( People_Language__c pl : [SELECT Id, Language__c, Fluency__c FROM People_Language__c WHERE Person__c = :pId] ) {
            pLanguages.add(new Wrapper(pl));
        }
    }

    public PageReference deleteLanguage() {
        List<People_Language__c> langsToDelete = new List<People_Language__c>();
        for ( Integer i = 0; i < pLanguages.size(); i++ ) {
            if ( pLanguages[i].checked ) {
                langsToDelete.add((pLanguages.remove(i--)).pl);
            }
        }
        delete langsToDelete;
        return null;
    }

    //WRAPPER
    public class Wrapper {
        public boolean checked {get; set;}
        public People_Language__c pl {get; set;}
        public Wrapper(People_Language__c pl) {
            this.pl = pl;
            this.checked = false; 
        }
    }
}

And then your VF markup becomes:

<apex:page controller="PeopleLanguagesController">
    <apex:form>
    <apex:pageBlock title="Language" id="language">
        <apex:pageBlockButtons location="top">
             <!--<apex:commandButton id="langNewBtn" value="{!$Label.New}" />-->
             <apex:commandButton id="LangDel" value="Delete Languages" action="{!deleteLanguage}" rerender="language"/>
        </apex:pageBlockButtons>
        <apex:pageBlockTable value="{!pLanguages}" var="lang" title="People Language">
            <apex:column width = "25px">
                <apex:inputCheckbox value="{!lang.checked}" />
            </apex:column>
            <apex:column styleClass="actionColumn" width = "25px"> 
                <apex:facet name="header"> <apex:outputText value="Action" /> </apex:facet>
                <apex:outputLink styleClass="actionLink" target="_top">Del</apex:outputLink>
            </apex:column>
            <apex:column > 
                <apex:facet name="header"> <apex:outputText value="Language" /> </apex:facet>
                <apex:outputField value="{!lang.pl.Language__c}" />
            </apex:column>
            <apex:column > 
                <apex:facet name="header"> <apex:outputText value="Fluency" /> </apex:facet>
                <apex:outputField value="{!lang.pl.Fluency__c}" />
            </apex:column>
        </apex:pageBlockTable> 
    </apex:pageBlock>
    </apex:form>
</apex:page>

Disclaimer: none of this code has been tested, this is just me throwing an example together in Notepad++. Hopefully this puts you on the right track!

Update: Okay, I threw together a data model like yours and the updated code compiles and seems to function as intended. You should not be getting the Invalid field checked for sObject People_Language__c error on the VF page because this field is part of the wrapper - make sure you have {!lang.checked} as the value of the apex:inputCheckbox tag, rather than {!lang.pl.checked}.