Select All Checkbox in Visualforce Page

Apex Code :
public class SelectAll {
    public List <Account> accountList {get;set;}
    public SelectAll () {
        accountList = [select id,name,phone,AccountSource,type from Account limit 5];
    }
}
Visualforce Page :
<apex:page controller="SelectAll">
    <script>
        function selectAllCheckboxes(obj,receivedInputID){
        var inputCheckBox = document.getElementsByTagName("input");                
        for(var i=0; i<inputCheckBox.length; i++){        
            if(inputCheckBox[i].id.indexOf(receivedInputID)!=-1) {                                    
                inputCheckBox[i].checked = obj.checked;
            }
        }
    }
    </script>
    <apex:form>
        <apex:pageBlock >
            <apex:pageBlockTable value="{!accountList}" var="acc"  id="AccountTable">
                <apex:column headerValue="Action" >
                    <apex:facet name="header">
                        <apex:inputCheckbox onclick="selectAllCheckboxes(this,'inputId')">
                            <apex:actionSupport event="onchange" reRender="AccountTable"/>
                        </apex:inputCheckbox>
                    </apex:facet>
                    <apex:inputCheckbox id="inputId" value="{!acc.id}" >
                         <apex:actionSupport event="onchange" />
                    </apex:inputCheckbox>
                </apex:column>
                <apex:column headerValue="Account Name" >
                    {!acc.name}
                </apex:column>
                <apex:column headerValue="Phone" >
                    {!acc.phone}
                </apex:column>
                <apex:column headerValue="Type" >
                    {!acc.type}
                </apex:column>
            </apex:pageBlockTable>
        </apex:pageBlock>
    </apex:form>
</apex:page>
Output: