Removing the standard css from the pageblock table

CSS, Javascript Examples

CSS Example1: Removing the standard css from the pageblock table

<apex:page standardController=”DataLoadTest__c” recordSetVar=”records” sidebar=”false”>
<style>
.headerRow th{
display:none;
}
</style>
<apex:form >
<apex:pageBlock >
<apex:pageblockSection >
<apex:pageBlockTable value=”{!records}” var=”r”>
<apex:column >
{!r.Name}
</apex:column>
<apex:column >
{!r.City__c}
</apex:column>
<apex:column >
{!r.Country__c}
</apex:column>
<apex:column >
{!r.phone__c}
</apex:column>
</apex:pageBlockTable>
</apex:pageblockSection>
</apex:pageBlock>
</apex:form>
</apex:page>

Example2: showModalDialog():

Gives the seperate window for any other calculations.
This belongs to javascript..
ex:
page:
<apex:page standardController=”DataLoadTest__c” recordSetVar=”records” sidebar=”false”>
<style>
.headerRow th{
display:none;
}
</style>
<script>
function showModal(val){
window.showModalDialog(‘/apex/second123?id=’+val);
}
</script>
<apex:form >
<apex:pageBlock >
<apex:pageblockSection >
<apex:pageBlockTable value=”{!records}” var=”r”>
<apex:column >
<apex:commandlink value=”{!r.Name}” onclick=”showModal(‘{!r.Id}’)” />
</apex:column>
</apex:pageBlockTable>
</apex:pageblockSection>
</apex:pageBlock>
</apex:form>
</apex:page>