\CJSCore::init(['access']);

<div id="bx_access_acceptor"></div>
<a href="javascript:void(0)" class="bx-action-href" onclick="ShowPanelFor('bx_access_acceptor', 'ACCEPTORS[]')"><?=Loc::getMessage('F_PRESET_SELECT');?></a>

function InsertAccess(arRights, divId, hiddenName)
{
	var div = BX(divId);
	for(var provider in arRights)
	{
		for(var id in arRights[provider])
		{
			var pr = BX.Access.GetProviderPrefix(provider, id);
			var newDiv = document.createElement('DIV');
			newDiv.style.marginBottom = '4px';
			newDiv.innerHTML = '<input type="hidden" name="'+hiddenName+'" value="'+id+'">' + (pr? pr+': ':'') + arRights[provider][id].name + '&nbsp;<a href="javascript:void(0);" onclick="DeleteAccess(this, \''+id+'\')" class="access-delete"></a>';
			div.appendChild(newDiv);
		}
	}
}

function DeleteAccess(ob, id)
{
	var div = BX.findParent(ob, {'tag':'div'});
	div.parentNode.removeChild(div);
}

function ShowPanelFor(divId, fieldName)
{
	BX.Access.Init({
		other: {disabled:true}
	});
	BX.Access.SetSelected({});
	BX.Access.ShowForm({
		callback: function(obSelected)
		{
			InsertAccess(obSelected, 'bx_access_acceptor', 'ACCEPTORS[]');
		}
	});
}