4 #result {background:lightgrey;}
5 #selector a {margin-right:10px;}
6 .required {font-weight:bold;}
7 .helpmsg {background:yellow;}
8 #explorer label {display:inline;}
9 code {line-height:1em;}
17 var restURL = CRM.url("civicrm/ajax/rest");
19 function toggleField (name, label, type) {
21 <label for="' + name + '">'+label+'</label>: <input name="' + name + '" data-id="'+name+ '" />\
22 <a href="#" class="remove-extra" title={/literal}"{ts escape="js"}Remove Field{/ts}"{literal}>X</a>\
24 if ( $('#extra [name=' + name + ']').length > 0) {
25 $('#extra [name=' + name + ']').parent().remove();
28 $('#extra').append (h);
32 function buildForm (params) {
33 var h = '<label>ID</label><input data-id="id" size="3" maxlength="20" />';
34 if (params.action == 'delete') {
39 CRM.api(params.entity, 'getFields', {}, {
40 success:function (data) {
41 h = {/literal}'<i>{ts escape="js"}Available fields (click to add/remove):{/ts}</i>'{literal};
42 $.each(data.values, function(key, value) {
43 var required = value.required ? " required" : "";
44 h += "<a data-id='" + key + "' class='type_" + value.type + required + "'>" + value.title + "</a>";
46 $('#selector').html(h);
51 function generateQuery () {
53 $('#explorer input:checkbox:checked, #explorer select, #extra input').each(function() {
54 var val = $(this).val();
56 params[$(this).data('id')] = val;
59 query = CRM.url("civicrm/ajax/rest", params);
60 $('#query').val(query);
61 if (params.action == 'delete' && $('#selector a').length == 0) {
65 if (params.action == 'create' && $('#selector a').length == 0) {
71 function runQuery(query) {
75 php = "$params = array(<br /> 'version' => 3,",
82 query = $('#query').val();
83 var hashes = query.slice(query.indexOf('?') + 1).split('&');
84 for(var i = 0; i < hashes.length; i++) {
85 hash = hashes[i].split('=');
95 action = value.toLowerCase();
96 $('#action').val(action);
99 entity = value.charAt(0).toUpperCase() + value.substr(1);
100 $('#entity').val(entity);
103 if (typeof value == 'undefined') {
106 value = isNaN(value) ? "'" + value + "'" : value;
107 smarty += ' ' + key + '=' + value;
108 php += "<br />  '" + key +"' => " + value + ",";
109 json += "'" + key + "': " + value + ", ";
114 $('#query').val({/literal}"{ts escape='js'}Choose an entity.{/ts}"{literal});
115 $('#entity').val('');
116 window.location.hash = 'explorer';
120 $('#query').val({/literal}"{ts escape='js'}Choose an action.{/ts}"{literal});
121 $('#action').val('');
122 window.location.hash = 'explorer';
126 window.location.hash = query;
127 $('#result').html('<i>Loading...</i>');
128 $.post(query,function(data) {
129 $('#result').text(data);
131 link="<a href='"+query+"' title='open in a new tab' target='_blank'>ajax query</a> ";
132 var RESTquery = CRM.config.resourceBase + "extern/rest.php?"+ query.substring(restURL.length,query.length) + "&api_key={yoursitekey}&key={yourkey}";
133 $("#link").html(link+"|<a href='"+RESTquery+"' title='open in a new tab' target='_blank'>REST query</a>.");
136 json = (json.length > 1 ? json.slice (0,-2) : '{') + '}';
137 php += "<br />);<br />";
138 $('#php').html(php + "$result = civicrm_api('" + entity + "', '" + action + "', $params);");
139 $('#jQuery').html ("CRM.api('"+entity+"', '"+action+"', "+json+",<br /> {success: function(data) {<br /> cj.each(data, function(key, value) {// do something });<br /> }<br /> }<br />);");
141 if (action.substring(0, 3) == "get") {//using smarty only make sense for get actions
142 $('#smarty').html("{crmAPI var='result' entity='" + entity + "' action='" + action + "' " + smarty + '}<br />{foreach from=$result.values item=' + entity + '}<br/> <li>{$' + entity +'.some_field}</li><br />{/foreach}');
144 $('#smarty').html("smarty uses only 'get' actions");
146 $('#generated').show();
149 var query = window.location.hash;
150 var t = "#/civicrm/ajax/rest";
151 if (query.substring(0, t.length) === t) {
152 $('#query').val (query.substring(1)).focus();
154 window.location.hash="explorer"; //to be sure to display the result under the generated code in the viewport
156 $('#entity, #action').change (function() { $("#selector, #extra").empty(); generateQuery(); runQuery(); });
157 $('#explorer input:checkbox').change(function() {generateQuery(); runQuery(); });
158 $('#explorer').submit(function() {runQuery(); return false;});
159 $('#extra').on('keyup', 'input', generateQuery);
160 $('#extra').on('click', 'a.remove-extra', function() {
161 $(this).parent().remove();
164 $('#selector').on('click', 'a', function() {
165 toggleField($(this).data('id'), this.innerHTML, this.class);
172 <label>entity</label>
173 <select id="entity" data-id="entity">
174 <option value="" selected="selected">Choose...</option>
175 {crmAPI entity="Entity" action="get" var="entities" version=3}
176 {foreach from=$entities.values item=entity}
177 <option value="{$entity}">{$entity}</option>
182 <label>action</label>
183 <select id="action" data-id="action">
184 <option value="" selected="selected">Choose...</option>
185 <option value="get">get</option>
186 <option value="create" title="used to update as well, if id is set">create</option>
187 <option value="delete">delete</option>
188 <option value="getfields">getfields</option>
189 <option value="getactions">getactions</option>
190 <option value="getcount">getcount</option>
191 <option value="getsingle">getsingle</option>
192 <option value="getvalue">getvalue</option>
193 <option value="getoptions">getoptions</option>
197 <label for="debug-checkbox">
198 <input type="checkbox" id="debug-checkbox" data-id="debug" checked="checked" value="1">debug
202 <label for="sequential-checkbox" title="{ts}sequential is a more compact format, that is nicer and general and easier to use for json and smarty.{/ts}">
203 <input type="checkbox" id="sequential-checkbox" data-id="sequential" checked="checked" value="1">sequential
207 <label for="json-checkbox">
208 <input type="checkbox" id="json-checkbox" data-id="json" checked="checked" value="1">json
211 <div id="selector"></div>
212 <div id="extra"></div>
213 <input size="90" maxsize=300 id="query" value="{crmURL p="civicrm/ajax/rest" q="json=1&debug=on&entity=Contact&action=get&sequential=1&return=display_name,email,phone"}"/>
214 <input type="submit" value="GO" title="press to run the API query"/>
215 <table id="generated" border=1 style="display:none;">
216 <caption>Generated codes for this api call</caption>
217 <tr><td>URL</td><td><div id="link"></div></td></tr>
218 <tr><td>smarty</td><td><code id="smarty" title='smarty syntax (mostly works for get actions)'></code></td></tr>
219 <tr><td>php</td><td><code id="php" title='php syntax'></code></td></tr>
220 <tr><td>javascript</td><td><code id="jQuery" title='javascript syntax'></code></td></tr>
223 You can choose an entity and an action (eg Tag Get to retrieve a list of the tags)
224 Or your can directly modify the url in the field above and press enter.
226 When you use the create method, it displays the list of existing fields for this entity.
227 click on the name of the fields you want to populate, fill the value(s) and press enter
229 The result of the ajax calls are displayed in this grey area.