使用Ajax / Jquery在Symfony2中返回表单视图

Currently posting data from a drop-down menu. I am trying to basically the form that is returning and then insert it into the page.

Select Drop-Down

<form method="POST" style="display: inline;">
    <select name="event_added" class="selectpicker">
        {% for subscription in form.peerEventSubscriptions %}
            <option value='{{typeDefEvent[loop.index0]}}'>{{ form_label(subscription.eventTypeHumanized) }}</option>
        {% endfor %}
    </select>
    <input type="submit" class="btn btn-default" id = "addEventButton" data-rel="tooltip" title="AddEvent" value="Add Event" style="line-height: 1.5" />
</form>

Ajax/Jquery

var addEvent = $("#addEventButton");

addEvent.click(function(){

    $.ajax({
            method: "POST",
            url: "{{ path('_add_new_sub_event') }}",
            contentType: 'application/json; charset=utf-8',
            data: { postVars: "EVENT_CLASS_JITTER EVENT_JITTER" }
        })
        .done(function( msg ) {
            console.log( "Data Saved: " + msg );
            window.stop();
        });

});

Controller

return this data, the form is valid.

return array(
    'form' => $form->createView(),
);

Getting a 500 internal server error. I just want to basically take this form and then render it to the current page, no refreshes.

I invite you to use FOSJsRoutingBundle,

Look at my example of my jQuery Ajax call:

$('#addNewVariant').on('click', function(event){
                var hidden_input = $('#hidden_input').val();
                hidden_input++;
                $.ajax({
                    type: "get",
                    dataType: 'json',
                    url: Routing.generate('admin_products_addNewVariant', {'number' : hidden_input }),
                    beforeSend: function(){
                        $('.loadingGif').show();
                        $('#loadingModal').modal('show');
                    },
                    success: function( returnedData ) {
                        $('#hidden_input').attr( 'value', hidden_input );
                        $('#ajaxVariantAdded').append('<li class="dd-item" data-id="'+returnedData.id+'"><div class="dd-handle"><a data-id="'+returnedData.id+'"><i class="fa fa-hand-o-right"></i> {{"tab.variant"|trans}} '+returnedData.name+'</a><a data-id="'+returnedData.id+'" data-toggle="modal" class="pull-right" href="#modal'+returnedData.id+'"><i class="glyphicon glyphicon-minus-sign"></i></a></div></li>');
                        $( '.ajax' ).append( returnedData.form );
                        $('.variant').hide();
                        $('.variantItem'+returnedData.id).show();
                        $('.loadingGif').hide();
                        $('#loadingModal').modal('hide');
                    },
                    error: function( returnedData){
                        $('.loadingGif').hide();
                        $('#loadingModal').modal('hide');
                    }
                });
            });

This is my route:

admin_products_addNewVariant:
    pattern:  /addVariation/{number}
    defaults: { _controller: "ProductsBundle:BackEnd/Products:addNewVariant" }
    options:
        expose: true

Finally this is my function:

public function addNewVariantAction($number){
        $entity = new Variant();
        $form = $this->createForm(new VariantType($number), $entity)->createView();
        $response = new JsonResponse(array(
                'form' => $this->renderView('ProductsBundle:Administration:Products/NewFormVariant/new.html.twig',array(
                        'form'          => $form,
                        'number'        => $number,
                    )
                ),
                'name'      => $number+1,
                'id'        => $number,
            ));

        return $response;
    }

I hope that my answer give a help.

</div>