Passing Parameter from JavaScript to controller don't seem to work

Question

I'm trying to send a parameter from Visual force page to controller to delete the row of record on pagetable via javascript using actionFunction. I'm able to get the alert messages from javascript function but not getting any error message or any required behaviour from controller. Seems like,its not getting called at all.

Any help will be highly appreciated.

Here is the visual force code:

<apex:form>
<apex:actionRegion id="AR">
    <apex:pageBlockTable value="{!NonRec}" var="Rec"> 
   <!--
      <apex:column headerValue="Action"> 
      <apex:facet name="Action">Action
            <apex:inputCheckbox onclick="selectAllCheckboxes(this,'inputId')"/> 

      </apex:facet>
     <apex:inputCheckbox value="{!Rec.Notification_to_Invoice__c}" id="inputId"/>

 <apex:column headerValue="Action" > 
 <apex:facet name="Action">Action</apex:facet>
 <apex:inputCheckbox value="{!Rec.Notification_to_Invoice__c}" id="inputId"/>
   <apex:outputText value="{!Rec.billingLink__c}" escape="false" styleClass="actionLink"/>&nbsp;|&nbsp;   

 <apex:commandLink onclick="DeleteBill('{!Rec.Name}');" value="Del" id="theCommandLink"/>   </apex:column>
     <apex:column > 
       <apex:facet name="header">Description</apex:facet> 
       <apex:outputText value="{!Rec.Name}"></apex:outputText>
       </apex:column>
       <apex:outputLabel value="{!Rec.Name}" id="RecId" />
    <apex:outputLink value="{!Rec.billingLink__c}" >Your Hyperlink Text</apex:outputLink>


         <apex:column > 
                <apex:facet name="header">Billing Amount per Period(USD)</apex:facet> 
                <apex:outputText value="{!Rec.Billing_Amount_Per_Period__c}"/>
                </apex:column>
        <apex:column headerValue="NTI"> 
                <apex:inputCheckbox value="{!Rec.Notification_to_Invoice__c}"/>
        </apex:column> 
                  </apex:pageBlockTable> 

<apex:pageBlockSection title="Recurring Billings - Variable"/>
    <apex:commandButton action="{!NewBillRecV}" style="btn" value="New Recurring-Variable Billings" immediate="false"/>
       <apex:pageBlockTable value="{!Records_Recurring_Var}" var="Record_Rec_var"> 
        <apex:column headerValue="Action"> 
      <apex:facet name="Action">Action
            <apex:inputCheckbox onclick="selectAllCheckboxes(this,'inputId')"/> 

      </apex:facet>
     <apex:inputCheckbox value="{!Record_Rec_var.Notification_to_Invoice__c}" id="inputId"/>

    <!-- Need to create a   wrapper  for selected flag    <apex:inputCheckbox value="{!Rec.selected}" id="inputId"/>     -->
       <apex:commandLink value="Del" action="{!DeleteBill}" styleClass="actionLink"/> <!-- action="{!saveAndReturn}"/> -->


  </apex:column> 

          <apex:column > 
            <apex:facet name="header">Description</apex:facet> 
            <apex:outputText value="{!Record_Rec_var.Name}"></apex:outputText>
         </apex:column>
         <apex:outputLabel value="{!Record_Rec_var.Name}" />
    <apex:outputLink value="{!Record_Rec_var.billingLink__c}" >Your Hyperlink Text</apex:outputLink>


         <apex:column > 
                <apex:facet name="header">Billing Amount(USD)</apex:facet> 
                <apex:outputText value="{!Record_Rec_var.Billing_Amount_Per_Period__c}"/>
                </apex:column>
                  <apex:column headerValue="Pop Start"> 
                <apex:outputText value="{!Record_Rec_var.Pop_Start__c}"/>
            </apex:column> 
                         <apex:column headerValue="Pop Stop"> 
                <apex:outputText value="{!Record_Rec_var.Pop_Stop__c}"/>
            </apex:column> 
            <apex:column headerValue="NTI"> 
                <apex:selectCheckboxes value="{!Record_Rec_var.Notification_to_Invoice__c}"/>
            </apex:column> 
             <apex:column headerValue="Date Submitted"> 
                <apex:outputText value="{!Record_Rec_var.Notification_to_Invoice_date__c}"/>
            </apex:column> 
          <apex:column headerValue="Submitted By"> 
                <apex:outputText value="{!Record_Rec_var.NotificationtoInvoiceUser__c}"/>
            </apex:column> 
      </apex:pageBlockTable> 

    </apex:pageBlock> 
    </apex:actionRegion>
    <apex:actionFunction action="{!DeleteBill1}" name="Deletefunc" reRender="AR" > 
    <apex:param name="billid" value=""/></apex:actionFunction>
    </apex:form>

 <script>
 function DeleteBill(id1){
    alert(id1);
            var x = confirm('Do you want to delete?');
            if (x){
                alert("Del");
            Deletefunc(id1); // seems like not getting called
            alert("return");
            }
}

 </script>

Here is controller code

 public PageReference DeleteBill1()
 {

  //   string passedparam = ApexPages.currentPage().getparameters().get('billid');
  SelectedBillId = Apexpages.currentPage().getParameters().get('billid');
     ApexPages.addmessage(new ApexPages.message(ApexPages.severity.ERROR,SelectedBillId));

      if(SelectedBillId == null){
      ApexPages.addmessage(new ApexPages.message(ApexPages.severity.ERROR,'NULL'));

          }
     Billing__c billTobeDeleted= null; //ApexPages.currentPage().getParameters().get('billid'); 
     for(Billing__c b:NonRec){
      //   Billing__c b = [Select id from billing__c where id =:billid limit 1];
       ApexPages.addmessage(new ApexPages.message(ApexPages.severity.ERROR,'selected Id' + SelectedBillId));

     if(b.Id==SelectedBillId){
          billTobeDeleted = b;
     }
     if(billTobeDeleted !=null){
         Delete billTobeDeleted;
         DisplayNonRecurring();

     }
     } 
    return null;
 }

Answer 1

Add a variable to your class say

public string delete_id {get;set;}

Add this to your action function

<apex:param name="billid" value="" assignTo="{!delete_id}"/>

Then in your DeleteBill1 method reference delete_id instead