Error deleting last value from a custom URL

I am currently creating a page that is accessed via the custom url functionality.

I am trying to delete all components in a multivalue field. I get a Cannot delete a value as an error when deleting the last one.

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" language="javascript" src="/WebUI/Core/Controls/Popup/PopupInit.js"></script>
    <script type="text/javascript" language="javascript">
    function removeAllValues() {

        var fields = window.dialogArguments.getFields();

        if (fields != null) {
            for (var i = 0; i < fields.length; i++) {
                window.dialogArguments.container.deleteField(fields[i]);
            }
        }
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <input type="button" onclick="removeAllValues();" value="Delete All" />
        </div>
    </form>
</body>
</html>

Is there any documentation other than two brief pages on the LiveContent site?

Solution

You could also change your function a little bit to delete all fields except the last one and then set the last fields value to nothing:

function removeAllValues() {

    var fields = window.dialogArguments.getFields();

    if (fields != null) {
        var lastFieldIndex = fields.length - 1;

        for (var i = 0; i < lastFieldIndex; i++) {
            window.dialogArguments.container.deleteField(fields[i]);
        }

        fields[lastFieldIndex].setValues([]);
    }
}