edit_orm_many_association_script.html.twig 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386
  1. {#
  2. This file is part of the Sonata package.
  3. (c) Thomas Rabaix <thomas.rabaix@sonata-project.org>
  4. For the full copyright and license information, please view the LICENSE
  5. file that was distributed with this source code.
  6. #}
  7. {#
  8. This code manage the many-to-[one|many] association field popup
  9. #}
  10. {% autoescape false %}
  11. <script>
  12. <!-- edit many association -->
  13. {#
  14. handle link click in a list :
  15. - if the parent has an objectId defined then the related input get updated
  16. - if the parent has NO object then an ajax request is made to refresh the popup
  17. #}
  18. var field_dialog_form_list_link_{{ id }} = function(event) {
  19. initialize_popup_{{ id }}();
  20. event.preventDefault();
  21. event.stopPropagation();
  22. Admin.log('[{{ id }}|field_dialog_form_list_link] handle link click in a list');
  23. var element = jQuery(this).parents('#field_dialog_{{ id }} td.sonata-ba-list-field');
  24. // the user does click on a row column
  25. if (element.length == 0) {
  26. // make a recursive call (ie: reset the filter)
  27. jQuery.ajax({
  28. type: 'GET',
  29. url: jQuery(this).attr('href'),
  30. success: function(html) {
  31. field_dialog_{{ id }}.html(html);
  32. }
  33. });
  34. return;
  35. }
  36. jQuery('#{{ id }}').val(element.attr('objectId'));
  37. jQuery('#{{ id }}').trigger('change');
  38. field_dialog_{{ id }}.dialog('close');
  39. }
  40. // handle the add link
  41. var field_dialog_form_list_{{ id }} = function(event) {
  42. initialize_popup_{{ id }}();
  43. event.preventDefault();
  44. event.stopPropagation();
  45. Admin.log('[{{ id }}|field_dialog_form_list] open the list modal');
  46. var a = jQuery(this);
  47. field_dialog_{{ id }}.html('');
  48. // retrieve the form element from the related admin generator
  49. jQuery.ajax({
  50. url: a.attr('href'),
  51. success: function(html) {
  52. Admin.log('[{{ id }}|field_dialog_form_list] retrieving the list content');
  53. // populate the popup container
  54. field_dialog_{{ id }}.html(html);
  55. Admin.add_filters(field_dialog_{{ id }});
  56. // capture the submit event to make an ajax call, ie : POST data to the
  57. // related create admin
  58. jQuery('a', field_dialog_{{ id }}).live('click', field_dialog_form_list_link_{{ id }});
  59. jQuery('form', field_dialog_{{ id }}).live('submit', function(event) {
  60. event.preventDefault();
  61. var form = jQuery(this);
  62. jQuery(form).ajaxSubmit({
  63. type: form.attr('method'),
  64. url: form.attr('action'),
  65. data: {_xml_http_request: true},
  66. success: function(html) {
  67. field_dialog_{{ id }}.html(html);
  68. }
  69. });
  70. });
  71. // open the dialog in modal mode
  72. field_dialog_{{ id }}.dialog({
  73. height: 'auto',
  74. width: 980,
  75. modal: true,
  76. resizable: false,
  77. title: '{{ sonata_admin.field_description.associationadmin.label }}',
  78. close: function(event, ui) {
  79. // make sure we have a clean state
  80. jQuery('a', field_dialog_{{ id }}).die('click');
  81. jQuery('form', field_dialog_{{ id }}).die('submit');
  82. },
  83. zIndex: 9998,
  84. });
  85. }
  86. });
  87. };
  88. // handle the add link
  89. var field_dialog_form_add_{{ id }} = function(event) {
  90. initialize_popup_{{ id }}();
  91. event.preventDefault();
  92. event.stopPropagation();
  93. var a = jQuery(this);
  94. field_dialog_{{ id }}.html('');
  95. Admin.log('[{{ id }}|field_dialog_form_add] add link action');
  96. // retrieve the form element from the related admin generator
  97. jQuery.ajax({
  98. url: a.attr('href'),
  99. success: function(html) {
  100. Admin.log('[{{ id }}|field_dialog_form_add] ajax success', field_dialog_{{ id }});
  101. // populate the popup container
  102. field_dialog_{{ id }}.html(html);
  103. // capture the submit event to make an ajax call, ie : POST data to the
  104. // related create admin
  105. jQuery('a', field_dialog_{{ id }}).live('click', field_dialog_form_action_{{ id }});
  106. jQuery('form', field_dialog_{{ id }}).live('submit', field_dialog_form_action_{{ id }});
  107. // open the dialog in modal mode
  108. field_dialog_{{ id }}.dialog({
  109. height: 'auto',
  110. width: 650,
  111. modal: true,
  112. resizable: false,
  113. title: '{{ sonata_admin.field_description.associationadmin.label }}',
  114. close: function(event, ui) {
  115. Admin.log('[{{ id }}|field_dialog_form_add] dialog closed - removing `live` events');
  116. // make sure we have a clean state
  117. jQuery('a', field_dialog_{{ id }}).die('click');
  118. jQuery('form', field_dialog_{{ id }}).die('submit');
  119. },
  120. zIndex: 9998,
  121. });
  122. }
  123. });
  124. };
  125. // handle the post data
  126. var field_dialog_form_action_{{ id }} = function(event) {
  127. event.preventDefault();
  128. event.stopPropagation();
  129. Admin.log('[{{ id }}|field_dialog_form_action] action catch', this);
  130. initialize_popup_{{ id }}();
  131. var element = jQuery(this);
  132. if (this.nodeName == 'FORM') {
  133. var url = element.attr('action');
  134. var type = element.attr('method');
  135. } else if (this.nodeName == 'A') {
  136. var url = element.attr('href');
  137. var type = 'GET';
  138. } else {
  139. alert('unexpected element : @' + this.nodeName + '@');
  140. return;
  141. }
  142. if (element.hasClass('sonata-ba-action')) {
  143. Admin.log('[{{ id }}|field_dialog_form_action] reserved action stop catch all events');
  144. return;
  145. }
  146. var data = {
  147. _xml_http_request: true
  148. }
  149. var form = jQuery(this);
  150. Admin.log('[{{ id }}|field_dialog_form_action] execute ajax call');
  151. // the ajax post
  152. jQuery(form).ajaxSubmit({
  153. url: url,
  154. type: type,
  155. data: data,
  156. success: function(data) {
  157. Admin.log('[{{ id }}|field_dialog_form_action] ajax success');
  158. if (typeof data == 'string') {
  159. field_dialog_{{ id }}.html(data);
  160. return;
  161. };
  162. // if the crud action return ok, then the element has been added
  163. // so the widget container must be refresh with the last option available
  164. if (data.result == 'ok') {
  165. field_dialog_{{ id }}.dialog('close');
  166. {% if sonata_admin.field_description.options.edit == 'list' %}
  167. {#
  168. in this case we update the hidden input, and call the change event to
  169. retrieve the post information
  170. #}
  171. jQuery('#{{ id }}').val(data.objectId);
  172. jQuery('#{{ id }}').change();
  173. {% else %}
  174. // reload the form element
  175. jQuery('#field_widget_{{ id }}').closest('form').ajaxSubmit({
  176. url: '{{ url('sonata_admin_retrieve_form_element', {
  177. 'elementId': id,
  178. 'objectId': sonata_admin.admin.root.id(sonata_admin.admin.root.subject),
  179. 'uniqid': sonata_admin.admin.root.uniqid,
  180. 'code': sonata_admin.admin.root.code
  181. }) }}',
  182. data: {_xml_http_request: true },
  183. type: 'POST',
  184. success: function(html) {
  185. jQuery('#field_container_{{ id }}').replaceWith(html);
  186. }
  187. });
  188. {% endif %}
  189. return;
  190. }
  191. // otherwise, display form error
  192. field_dialog_{{ id }}.html(html);
  193. Admin.add_pretty_errors(field_dialog_{{ id }});
  194. // reattach the event
  195. jQuery('form', field_dialog_{{ id }}).submit(field_dialog_form_action_{{ id }});
  196. }
  197. });
  198. return false;
  199. }
  200. var field_dialog_{{ id }} = false;
  201. function initialize_popup_{{ id }}() {
  202. // initialize component
  203. if (!field_dialog_{{ id }}) {
  204. field_dialog_{{ id }} = jQuery("#field_dialog_{{ id }}");
  205. // move the dialog as a child of the root element, nested form breaks html ...
  206. jQuery(document).append(field_dialog_{{ id }});
  207. Admin.log('[{{ id }}|field_dialog] move dialog container as a document child');
  208. }
  209. }
  210. {#
  211. This code is used to defined the "add" popup
  212. #}
  213. // this function initialize the popup
  214. // this can be only done this way has popup can be cascaded
  215. function start_field_dialog_form_add_{{ id }}(event) {
  216. var targetElement = Admin.stopEvent(event);
  217. // remove the html event a
  218. var a = jQuery(targetElement).closest('a');
  219. a.removeAttr('onclick');
  220. initialize_popup_{{ id }}();
  221. // add the jQuery event to the a element
  222. a.click(field_dialog_form_add_{{ id }});
  223. // trigger the event
  224. a.trigger('click');
  225. return false;
  226. }
  227. Admin.add_pretty_errors(field_dialog_{{ id }});
  228. {% if sonata_admin.field_description.options.edit == 'list' %}
  229. {#
  230. This code is used to defined the "list" popup
  231. #}
  232. // this function initialize the popup
  233. // this can be only done this way has popup can be cascaded
  234. function start_field_dialog_form_list_{{ id }}(event) {
  235. var targetElement = Admin.stopEvent(event);
  236. // remove the html event a
  237. var a = jQuery(targetElement).closest('a');
  238. a.removeAttr('onclick');
  239. initialize_popup_{{ id }}();
  240. // add the jQuery event to the a element
  241. a.click(field_dialog_form_list_{{ id }});
  242. // trigger the event
  243. a.trigger('click');
  244. return false;
  245. }
  246. function remove_selected_element_{{ id }}(event) {
  247. var targetElement = Admin.stopEvent(event);
  248. // remove the html event a
  249. var a = jQuery(targetElement).closest('a');
  250. a.removeAttr('onclick');
  251. a.click(field_remove_element_{{ id}});
  252. a.trigger('click');
  253. return false;
  254. }
  255. function field_remove_element_{{ id }}(event) {
  256. event.preventDefault();
  257. if (jQuery('#{{ id }} option').get(0)) {
  258. jQuery('#{{ id }}').attr('selectedIndex', '-1').children("option:selected").attr("selected", false);
  259. }
  260. jQuery('#{{ id }}').val('');
  261. jQuery('#{{ id }}').trigger('change');
  262. return false;
  263. }
  264. {#
  265. attach onchange event on the input
  266. #}
  267. // update the label
  268. jQuery('#{{ id }}').live('change', function(event) {
  269. Admin.log('[{{ id }}] update the label');
  270. jQuery('#field_widget_{{ id }}').html("<span><img src=\"{{ asset('bundles/sonataadmin/ajax-loader.gif') }}\" style=\"vertical-align: middle; margin-right: 10px\"/>{{ 'loading_information ...'|trans([], 'SonataAdminBundle') }}</span>");
  271. jQuery.ajax({
  272. type: 'GET',
  273. url: '{{ url('sonata_admin_short_object_information', {
  274. 'objectId': 'OBJECT_ID',
  275. 'uniqid': sonata_admin.field_description.associationadmin.uniqid,
  276. 'code': sonata_admin.field_description.associationadmin.code
  277. })}}'.replace('OBJECT_ID', jQuery(this).val()),
  278. success: function(html) {
  279. jQuery('#field_widget_{{ id }}').html(html);
  280. }
  281. });
  282. });
  283. {% endif %}
  284. <!-- / edit many association -->
  285. </script>
  286. {% endautoescape %}