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
kriiyerkriiyer 

Javascript error "Invalid argument" while using apex:commandLink

Hi all,
 
I get a Javascript error (Invalid Argument) while using apex:commandLink. My code is as under:
 
Code:
<apex:pageBlock rendered="{!showFifthSection}">
    <table width="80%">
        <tr>
            <td style="font-weight:bold;" width="20%" valign="top">
                Enter Hi ROC adjustment criteria:
            </td>
            <td width="10%">
                <apex:inputField value="{!contractTerms.ADJ_RT_CRITERIA__c}" />
            </td>
            <td></td>
        </tr>
        <tr>
            <td colspan="3">
                <apex:pageMessage severity="info" strength="1" title="Please include details regarding the criteria for which the Hi-ROC rate reduction or increase would adjust.  Describe any rate adjustment tables, and include references to pages and sections within the contract that explain the rate adjustment criteria.  Include details, such as number of month's notice an account must have before a rate change." />
            </td>
        </tr>
        <tr>
            <td style="font-weight:bold;">Enter effective date(s) Hi-ROC adjustment(s):</td>
            <td><apex:inputField id="termDt" value="{!termDates.Date__c}"/> <apex:CommandButton action="{!addTermDates}" value="Add" onclick="return checkBlankDate(document.getElementById('{!$Component.termDt}'));"></apex:CommandButton>
        </td>
        <td></td>
    </tr>
    <tr>
        <td colspan="3 align="left">
            <apex:dataTable value="{!allTermDates}" var="a" title="Details of Effective Date" >
                <apex:column >
                     <apex:commandLink value="Remove" action="{!removeTermDates}">
                         <apex:param name="termDates" value="{!a.Id}" />
                     </apex:commandLink>
                </apex:column>
                <apex:column > <span style="padding:15px;"/><apex:outputField value="{!a.Date__c}"/></apex:column>
            </apex:dataTable>
        </td>
    </tr>
    <tr>
        <td colspan="3" align="right">
            <apex:commandButton action="{!nextPage}" value="Continue" styleClass="btn" onclick="return checkEmptyFields(this.form);"></apex:commandButton>
        </td>
    </tr>
</table>    
</apex:pageBlock>

 It throws me an error as soon as I click the Remove link. However the records get deleted on the Remove Link but it throws the error. Kindly advise if I've missed out on anything.
When I do a View Source of the generated page it says that there is an error in a javascript function that is generated by Salesforce. The function name is dpf() and the error is thrown at if (adp != null). The javascript generated code is as under.
Code:
 
 
function dpf(f) {
    var adp = f.adp;
    if (adp != null) {
        for (var i = 0;i < adp.length;i++) {
            f.removeChild(adp[i]);
        }
    }
};
function apf(f, pvp) {
  var adp = new Array();
  f.adp = adp;var ps = pvp.split(',');
  for (var i = 0,ii = 0;i < ps.length;i++,ii++) {
    var p = document.createElement("input");
    p.type = "hidden";  
    p.name = ps[i];
    p.value = ps[i + 1];
    f.appendChild(p);
    adp[ii] = p;i += 1;
  }
};
 
function jsfcljs(f, pvp, t) {
  apf(f, pvp);
  var ft = f.target;
  if (t) {
    f.target = t;
  }
  f.submit();
  f.target = ft; 
  dpf(f);
};

 Are there any constraints on using an apex:commandLink or an apex:dataTable within an HTML table?


Message Edited by kriiyer on 07-29-2008 07:07 AM
Best Answer chosen by Admin (Salesforce Developers) 
cajcaj

 I am writing a customer portal application with a customized "look and feel" and although setting

 

<apex:page showHeader="true">
 
does resolve the issue in IE 7 this is will not work for my purposes. If you view the HTML source for a visual force page with a commandlink defined on the page and the showheader attribute set to false in the customer portal, the following javascript snippet is generated:
 
 
function dpf(f) {
    var adp = f.adp;
    if (adp != null) {
        for (var i = 0;i < adp.length;i++) {
            f.removeChild(adp[i]);
        }
    }
}
function apf(f, pvp) {
    var adp = new Array();
    f.adp = adp;
    var ps = pvp.split(',');
    for (var i = 0,ii = 0;i < ps.length;i++,ii++) {
        var p = document.createElement("input");
        p.type = "hidden";
        p.name = ps[i];
        p.value = ps[i + 1];
        f.appendChild(p);
        adp[ii] = p;
        i += 1;
    }
}
function jsfcljs(f, pvp, t) {
    apf(f, pvp);
    var ft = f.target;
    if (t) {
        f.target = t;
    }
    f.submit();
    f.target = ft;
    dpf(f);
}
 
 
The problem is with the f.removeChild(adp[i]) method call in the function dpf(f) throws an "Invalid Argument" exception in IE 7. A work around for this is I have refactored the dpf function to include a try catch block on the f.removeChild(adp[i]) method call and have included this javascript in my visual force page to overide the salesforce generated function. This works in both IE7 and FF.
 
Hopefully saleforce can refactor the javascript in the future to prevent the exception from being thrown.
 
function dpf(f) {
    var adp = f.adp;
    if (adp != null) {
        for (var i = 0;i < adp.length;i++) {
            try {
                f.removeChild(adp[i]);
            }
            catch (e) {
                adp[i].parentNode.removeChild(adp[i]);
            }
        }
    }
}
function apf(f, pvp) {
    var adp = new Array();
    f.adp = adp;
    var ps = pvp.split(',');
    for (var i = 0,ii = 0;i < ps.length;i++,ii++) {
        var p = document.createElement("input");
        p.type = "hidden";
        p.name = ps[i];
        p.value = ps[i + 1];
        f.appendChild(p);
        adp[ii] = p;
        i += 1;
    }
}
function jsfcljs(f, pvp, t) {
    apf(f, pvp);
    var ft = f.target;
    if (t) {
        f.target = t;
    }
    f.submit();
    f.target = ft;
    dpf(f);
}
	
	 
 
 
 
Message Edited by caj on 08-25-2009 11:07 AM
Message Edited by caj on  08-25-2009 11:10 AM


All Answers
Sami CohenSami Cohen
You probably set the attribute showheader = "false" on the page tag.
<apex:page showheader="false">
 
 


cajcaj
 I am writing a customer portal application with a customized "look and feel" and although setting
 
<apex:page showHeader="true">
 
does resolve the issue in IE 7 this is will not work for my purposes. If you view the HTML source for a visual force page with a commandlink defined on the page and the showheader attribute set to false in the customer portal, the following javascript snippet is generated:
 
 
function dpf(f) {
    var adp = f.adp;
    if (adp != null) {
        for (var i = 0;i < adp.length;i++) {
            f.removeChild(adp[i]);
        }
    }
}
function apf(f, pvp) {
    var adp = new Array();
    f.adp = adp;
    var ps = pvp.split(',');
    for (var i = 0,ii = 0;i < ps.length;i++,ii++) {
        var p = document.createElement("input");
        p.type = "hidden";
        p.name = ps[i];
        p.value = ps[i + 1];
        f.appendChild(p);
        adp[ii] = p;
        i += 1;
    }
}
function jsfcljs(f, pvp, t) {
    apf(f, pvp);
    var ft = f.target;
    if (t) {
        f.target = t;
    }
    f.submit();
    f.target = ft;
    dpf(f);
}
 
 
The problem is with the f.removeChild(adp[i]) method call in the function dpf(f) throws an "Invalid Argument" exception in IE 7. A work around for this is I have refactored the dpf function to include a try catch block on the f.removeChild(adp[i]) method call and have included this javascript in my visual force page to overide the salesforce generated function. This works in both IE7 and FF.
 
Hopefully saleforce can refactor the javascript in the future to prevent the exception from being thrown.
 
function dpf(f) {
    var adp = f.adp;
    if (adp != null) {
        for (var i = 0;i < adp.length;i++) {
            try {
                f.removeChild(adp[i]);
            }
            catch (e) {
                adp[i].parentNode.removeChild(adp[i]);
            }
        }
    }
}
function apf(f, pvp) {
    var adp = new Array();
    f.adp = adp;
    var ps = pvp.split(',');
    for (var i = 0,ii = 0;i < ps.length;i++,ii++) {
        var p = document.createElement("input");
        p.type = "hidden";
        p.name = ps[i];
        p.value = ps[i + 1];
        f.appendChild(p);
        adp[ii] = p;
        i += 1;
    }
}
function jsfcljs(f, pvp, t) {
    apf(f, pvp);
    var ft = f.target;
    if (t) {
        f.target = t;
    }
    f.submit();
    f.target = ft;
    dpf(f);
}
	
	 
 
 
 
Message Edited by caj on 08-25-2009 11:07 AM
Message Edited by caj on  08-25-2009 11:10 AM
This was selected as the best answer
TomPayneTomPayne
Just to clarify, I'm fairly sure that this is caused by an input element (adp[i]) that isn't a direct child of the form element (f). So it would break if the input is within a table, for example.
 
Probably a neater solution would be:
 
function dpf(f) {
    var adp = f.adp;
    if (adp != null) {
        for (var i = 0;i < adp.length;i++) {
            adp[i].parentNode.removeChild(adp[i]);
        }
    }
}
 
which means that you'll always be able to remove the node in question.
 
HTH
 
TomP 


TomPayneTomPayne
Oops - I just re-read your fix - seems you got the parentNode in the catch block after all - sorry!
 
Must read more carefully next time...