I have a form in Symfony2 project and I need to submit form. The first idea was to submit using ajax but the problem is that this will not pass the symfony2 required validation and I am getting the CSRF error message (see my precedant question : Symfony2: The CSRF token is invalid. Please try to resubmit the form).
Thank’s to @Elnur’s answer, I am able now to submit the form using $post but have another problem.
With Ajay, I am getting back an html response and I was able to asign this response to an HTML element:
$.ajax({
type: "POST",
async: true,
url: href,
cache: false,
dataType: "json",
success: function(data) {
$("#content .contentwrap .itemwrap").html( data.content );
}
});
Here is the response I am getting from:
<div class="item item-last">
<h1>Create Affiliation</h1>
<div class="error">
<ul><li>The CSRF token is invalid. Please try to resubmit the form</li></ul>
<ul><li>The Affiliation should not be blank</li></ul>
</div>
</div>
<div class="item item-last">
<form action="/app_dev.php/user/submission/affiliation/create/4a0ad9f8020c5cd5712ff4c4c8921b32?ajax=no" method="POST" class="authorForm" >
<div style="float:left;">
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td>
<label for="submissionAffiliationForm_affiliation" class=" required">Affiliation</label>
</td>
<td>
<input type="text" id="submissionAffiliationForm_affiliation" name="submissionAffiliationForm[affiliation]" required="required" size="40" />
</td>
</tr>
<tr>
<td>
</td>
<td>
<div class="button button-left button-cancel">
<img src="/bundles/sciforumversion2/images/design/new/button-red.png"/>
<a href="/app_dev.php/user/submission/author/edit/4a0ad9f8020c5cd5712ff4c4c8921b32/0" class="submission_link">cancel</a>
</div>
<div style="float: left;"> </div>
<div class="button button-left button-cancel">
<img src="/bundles/sciforumversion2/images/design/new/button.png"/>
<input type="submit" name="login" value="submit" />
</div>
<div style="clear: both;"></div>
</td>
</tr>
</table>
</div>
<input type="hidden" id="submissionAffiliationForm__token" name="submissionAffiliationForm[_token]" value="de9690f61f0ee5f30fdcc5152f44e76787f34bbb" />
</form>
</div>
But now, when using post:
$.post($this.attr('action'), $this.serialize(), function (data) {
$("#content .contentwrap .itemwrap").html( data );
});
I am not getting anymore HTML but a JSON formated response and I don’t know how to extract he right information from.
Here is the response I am getting from the post:
{"responseCode":400,"errors":false,"submitted":false,"content":"<!DOCTYPE html>\n<html>\n <head>\n <meta http-equiv=\"Content-Type\" content=\"text\/html; charset=utf-8\" \/>\n <meta http-equiv=\"refresh\" content=\"1;url=\/app_dev.php\/user\/submission\/4a0ad9f8020c5cd5712ff4c4c8921b32\" \/>\n\n <title>Redirecting to \/app_dev.php\/user\/submission\/4a0ad9f8020c5cd5712ff4c4c8921b32<\/title>\n <\/head>\n <body>\n Redirecting to <a href=\"\/app_dev.php\/user\/submission\/4a0ad9f8020c5cd5712ff4c4c8921b32\">\/app_dev.php\/user\/submission\/4a0ad9f8020c5cd5712ff4c4c8921b32<\/a>.\n <\/body>\n<\/html>","notice":""}
Here is how it looks like th controller:
$em = $this->getDoctrine()->getEntityManager();
// get the user object
$user = $this->get('security.context')->getToken()->getUser();
$submission = $em->getRepository('SciForumVersion2Bundle:Submission')->findOneBy( array("hash_key"=>$hash_key) );
$author = $em->getRepository('SciForumVersion2Bundle:SubmissionAuthor')->findOneBy( array("id"=>$author_id, "hash_key"=>$hash_key) );
if( $author == null ) {
$author = new SubmissionAuthor();
$author->setPerson( new Person() );
}
$enquiry = new Affiliation();
$formType = new SubmissionAffiliationFormType();
$form = $this->createForm($formType, $enquiry);
$request = $this->getRequest();
$valid = true;
$error = '';
if( $request->get('cancel') == 'yes' ) return $this->redirect($this->generateUrl('SciForumVersion2Bundle_user_submission', array("key"=>$submission->getHashKey())));
if ($request->getMethod() == 'POST' && $request->get('ajax') == 'no') {
$form->bindRequest($request);
if ($valid = $form->isValid()) {
if( $valid ) {
$em->persist($enquiry);
$em->flush();
$uAff = new UserAffiliation();
$uAff->setUserId( $user->getId() );
$uAff->setAffiliationId( $enquiry->getId() );
$uAff->setUser( $user );
$uAff->setAffiliation( $enquiry );
$em->persist($uAff);
$em->flush();
// Redirect - This is important to prevent users re-posting
// the form if they refresh the page
return $this->redirect($this->generateUrl('SciForumVersion2Bundle_user_submission', array("key"=>$submission->getHashKey())));
}
}
Your issue is that you’re returning a full new HTML content.
You need to return only informations that your JS can understand and treat the way you want.
This class in SF allows you to return plain content.
Here’s a way to use it.
Then in your JS
You could imagine any parameter to pass through
$dataI used
HTTP/1.1codes to talk with Javascript but you can use anything you wantEx:
JS