SonataAdminBundle/Resources/views/CRUD/edit_many_association_script.html.twig

{#

This file is part of the Sonata package.

(c) Thomas Rabaix <thomas.rabaix@sonata-project.org>

For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.

#}


{#

This code manage the many-to-[one|many] association field popup

#}

{% autoescape false %}

<script>
    <!-- edit many association -->

    {#
      handle link click in a list :
        - if the parent has an objectId defined then the related input get updated
        - if the parent has NO object then an ajax request is made to refresh the popup
    #}
    var field_dialog_form_list_link_{{ admin.uniqid }}_{{ field_element.id }} = function(event) {
        initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}();
        
        event.preventDefault();

        var element = jQuery(this).parents('#field_dialog_{{ admin.uniqid }}_{{ field_element.id }} td.sonata-ba-list-field');

        // the user does does click on a row column
        if(element.length == 0) {
            // make a recursive call (ie: reset the filter)
            jQuery.ajax({
                type: 'GET',
                url: jQuery(this).attr('href'),
                success: function(html) {
                   field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html(html);
                }
            });

            return;
        }

        jQuery('#{{ field_element.id }}').val(element.attr('objectId'));
        jQuery('#{{ field_element.id }}').trigger('change');

        field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.dialog('close');
    }


    // handle the add link
    var field_dialog_form_list_{{ admin.uniqid }}_{{ field_element.id }} = function(event) {

        initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}();

        event.preventDefault();

        var a = jQuery(this);

        field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html('');


        // retrieve the form element from the related admin generator
        jQuery.ajax({
            url: a.attr('href'),
            success: function(html) {

                // populate the popup container
                field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html(html);

                // capture the submit event to make an ajax call, ie : POST data to the
                // related create admin
                jQuery('a', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).live('click', field_dialog_form_list_link_{{ admin.uniqid }}_{{ field_element.id }});
                jQuery('form', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).live('submit', function(event) {
                    event.preventDefault();

                    var form = jQuery(this);

                    jQuery.ajax({
                        type: form.attr('method'),
                        url: form.attr('action'),
                        data: form.serializeArray(),
                        success: function(html) {
                           field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html(html);
                        }
                    });
                });

                // open the dialog in modal mode
                field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.dialog({
                    height: 'auto',
                    width: 980,
                    modal: true,
                    resizable: false,
                    title: '{{ field_description.associationadmin.label }}',
                    close: function(event, ui) {
                        // make sure we have a clean state
                        jQuery('a', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).die('click');
                        jQuery('form', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).die('submit');
                    }
                });
            }
        });
    };

    // handle the add link
    var field_dialog_form_add_{{ admin.uniqid }}_{{ field_element.id }} = function(event) {
        initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}();

        event.preventDefault();

        var a = jQuery(this);

        field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html('');

        // retrieve the form element from the related admin generator
        jQuery.ajax({
            url: a.attr('href'),
            success: function(html) {
                
                // populate the popup container
                field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html(html);

                // capture the submit event to make an ajax call, ie : POST data to the
                // related create admin
                jQuery('a', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).live('click', field_dialog_form_action_{{ admin.uniqid }}_{{ field_element.id }});
                jQuery('form', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).live('submit', field_dialog_form_action_{{ admin.uniqid }}_{{ field_element.id }});

                // open the dialog in modal mode
                field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.dialog({
                    height: 'auto',
                    width: 650,
                    modal: true,
                    resizable: false,
                    title: '{{ field_description.associationadmin.label }}',
                    close: function(event, ui) {
                        // make sure we have a clean state
                        jQuery('a', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).die('click');
                        jQuery('form', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).die('submit');
                    }
                });
            }
        });
    };
    
    // handle the post data
    var field_dialog_form_action_{{ admin.uniqid }}_{{ field_element.id }} = function(event) {

        event.preventDefault();

        initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}();

        var element = jQuery(this);

        if (this.nodeName == 'FORM') {
            var url  = element.attr('action');
            var type = element.attr('method');
            var data = element.serializeArray();
        } else if (this.nodeName == 'A') {
            var url  = element.attr('href');
            var type = 'GET';
            var data = {};
        } else {
            alert('unexpected element : @' + this.nodeName + '@');
            return;
        }
        
        var form = jQuery(this);

        // the ajax post
        jQuery.ajax({
            url: url,
            type: type,
            data: data,
            success: function(data) {

                if(typeof data == 'string') {
                    field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html(data);
                    return;
                };

                // if the crud action return ok, then the element has been added
                // so the widget container must be refresh with the last option available
                if (data.result == 'ok') {
                    field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.dialog('close');

                    {% if field_description.options.edit == 'list' %}
                        {#
                           in this case we update the hidden input, and call the change event to
                           retrieve the post information
                        #}
                        console.log(jQuery('#{{ field_element.id }}'));
                        jQuery('#{{ field_element.id }}').val(data.objectId);
                        jQuery('#{{ field_element.id }}').change();

                    {% else %}

                        // reload the form element
                        jQuery.ajax({
                            url: '{{ url('sonata_base_application_retrieve_form_element', {
                                'elementId': field_element.id,
                                'objectId':  admin.root.subject.id,
                                'uniqid':    admin.root.uniqid,
                                'code':      admin.root.code
                            }) }}',
                            data: jQuery('#field_widget_{{ admin.uniqid }}_{{ field_element.id }}').closest('form').serializeArray(),
                            type: 'POST',
                            success: function(html) {
                                jQuery('#field_widget_{{ admin.uniqid }}_{{ field_element.id }}').html(html);
                            }
                        });

                    {% endif %}

                    return;
                }

                // otherwise, display form error
                field_dialog_{{ admin.uniqid }}_{{ field_element.id }}.html(html);

                BaseApplication.add_pretty_errors(field_dialog_{{ admin.uniqid }}_{{ field_element.id }});

                // reattach the event
                jQuery('form', field_dialog_{{ admin.uniqid }}_{{ field_element.id }}).submit(field_dialog_form_action_{{ admin.uniqid }}_{{ field_element.id }});
            }
        });

        return false;
    }

    var field_dialog_{{ admin.uniqid }}_{{ field_element.id }} = false;

    function initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}() {
        // initialize component
        if(!field_dialog_{{ admin.uniqid }}_{{ field_element.id }}) {
            field_dialog_{{ admin.uniqid }}_{{ field_element.id }} = jQuery("#field_dialog_{{ admin.uniqid }}_{{ field_element.id }}");

            // move the dialog as a child of the root element, nested form breaks html ...
            jQuery(document).append(field_dialog_{{ admin.uniqid }}_{{ field_element.id }});
        }
    }

    {#
        This code is used to defined the "add" popup
    #}
    // this function initialize the popup
    // this can be only done this way has popup can be cascaded
    function start_field_dialog_form_add_{{ admin.uniqid }}_{{ field_element.id }}(event) {
        event.preventDefault();

        // remove the html event a
        var a = jQuery(event.target).closest('a');
        a.attr('onclick', '');

        initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}();

       // add the jQuery event to the a element
        a.click(field_dialog_form_add_{{ admin.uniqid }}_{{ field_element.id }});

        // trigger the event
        a.trigger('click');

        return false;
    }

    BaseApplication.add_pretty_errors(field_dialog_{{ admin.uniqid }}_{{ field_element.id }});


    {% if field_description.options.edit == 'list' %}
        {#
            This code is used to defined the "list" popup
        #}
        // this function initialize the popup
        // this can be only done this way has popup can be cascaded
        function start_field_dialog_form_list_{{ admin.uniqid }}_{{ field_element.id }}(event) {
            event.preventDefault();

            // remove the html event a
            var a = jQuery(event.target).closest('a');
            a.attr('onclick', '');

            initialize_popup_{{ admin.uniqid }}_{{ field_element.id }}();

            // add the jQuery event to the a element
            a.click(field_dialog_form_list_{{ admin.uniqid }}_{{ field_element.id }});

            // trigger the event
            a.trigger('click');

            return false;
        }

        {#
          attach onchange event on the input
        #}

        // update the 
        jQuery('#{{ field_element.id }}').live('change', function(event) {
            jQuery.ajax({
                type: 'GET',
                url: '{{ url('sonata_base_application_short_object_information', {
                    'objectId': 'OBJECT_ID',
                    'uniqid': field_description.associationadmin.uniqid,
                    'code': field_description.associationadmin.code
                })}}'.replace('OBJECT_ID', jQuery(this).val()),
                success: function(html) {
                    jQuery('#field_widget_{{ admin.uniqid }}_{{ field_element.id }}').html(html);
                }
            });
        });

    {% endif %}

    <!-- / edit many association -->
</script>

{% endautoescape %}