0

I am working on a registration form in symfony2 with angular js. My doubt is can we do angular js validations in a symfony2 form? because i cannot validate the form and also i dont know how to post form values to symfony controller.. please help.. I am stuck in project..

please check my registration.html.twig code..

<body ng-app="LoginApp">
    <div id="register" class="animate form" ng-controller="RegisterController as registerCtrl">
            {{ form_start(form, {'attr': {'name':'registerFrm', 'id':'registerFrmId','novalidate': '', 'ng-submit':'registerCtrl.registerFrm()'}}) }}
                Your username
                {{ form_row(form.username) }}
                <span class="error" ng-show="submitted && registerFrm.adminuser[username].$error.required">Username is required!</span>

                Your email
                {{ form_row(form.email) }}
                <span class="error" ng-show="submitted && registerFrm.adminuser[email].$invalid">Invalid email</span>

                Your password
                {{ form_row(form.plainPassword.first) }}
                <span class="error" ng-show="submitted && registerFrm.adminuser[plainPassword][first].$error.required">Password is required!</span>

                Please confirm your password 
                {{ form_row(form.plainPassword.second) }}
                <span class="error" ng-show="submitted && registerFrm.adminuser[plainPassword][second].$error.required">Password is required!</span>

                <p class="signin button"> 
                    <input type="submit" name="signup" ng-model="signup" ng-click="submitted=true" value="Sign up" /> 
                </p>
            {{ form_end(form) }}
        </div>

        <script>
            var App = angular.module('LoginApp',[]);

            App.controller('RegisterController', ['$scope',function($scope) {

            }]);
        </script>
    </body>

My symfony form builder

$builder
->add('username', TextType::class , array( 
    'label'  => false,
    'attr'   =>  array(
        'ng-model' => 'formData.username',
        'id' => 'usernamesignup',
        'placeholder' => 'myusername690',
        'required' => false)
    ))
->add('email', TextType::class , array( 
    'label'  => false,
    'attr'   =>  array(
        'ng-model' => 'formData.email',
        'id' => 'emailsignup',
        'placeholder' => '[email protected]',
        'ng-pattern' => '/^([0-9a-zA-Z]([-\.\w]*[0-9a-zA-Z])*@([0-9a-zA-Z][-\w]*[0-9a-zA-Z]\.)+[a-zA-Z]{2,9})$/',
        'required' => false)
    ))
->add('plainPassword', RepeatedType::class, array(
    'type' => PasswordType::class,
    'first_options'  => array(
        'label' => false,
        'attr'   =>  array(
            'ng-model' => 'formData.password',
            'id' => 'passwordsignup',
            'placeholder' => 'eg. X8df!90EO',
            'required' => false)
        ),
    'second_options' => array('label' => false,
    'attr'   =>  array(
            'ng-model' => 'formData.confirm_password',
            'id' => 'passwordsignup_confirm',
            'placeholder' => 'eg. X8df!90EO',
            'required' => false)
        ),
    )
);

registration form image

Improve this question

2 Answers 2

Reset to default
1

Hey Dmitry Grachikov,

Please change your code

<span class="error" ng-show="submitted && registerFrm.adminuser[username].$error.required">Username is required!</span>

to 

<span class="error" ng-show="submitted && registerFrm['adminuser[username]'].$error.required">Username is required!</span>

Your code having syntactic JS error.

If you want to reference a property named adminuser[username], you should do it like this:

registerFrm['adminuser[username]'].$error

registerFrm.adminuser[username] is incorrectly interpreted as (registerFrm.adminuser)[username]

Improve this answer
0

The easiest ways there is to render your form in twig just to get html of a form with field names. Afterwards you have to use exactly the same field names in form submit request and symfony forms component will handle it.

Improve this answer
4
  • you mean i want to create a normal HTML form for registration?
    – reb
    Commented Jun 22, 2016 at 8:39
  • Yes, but you can remove it afterwards. Just get html code of form and make the same on js.
    – Dmitry Grachikov
    Commented Jun 22, 2016 at 12:29
  • i tried and i am getting in console like this username=admin&email=krebinj%40gmail.com&plainPassword=654321&password=654321 but when i print $user , i am getting null array values..like this AppBundle\Entity\User Object ( [username:AppBundle\Entity\User:private] => [email:AppBundle\Entity\User:private] => [password:AppBundle\Entity\User:private] => [plainPassword:AppBundle\Entity\User:private] => [createDate:AppBundle\Entity\User:private] => [id:AppBundle\Entity\User:private] => )
    – reb
    Commented Jun 22, 2016 at 13:00
  • Symfony form fields always have names like form[username] so username=admin in requires simply not enough. Do you see fields like <input id="form_name_username" name="form[username]" /> in html?
    – Dmitry Grachikov
    Commented Jun 22, 2016 at 13:33

Not the answer you're looking for? Browse other questions tagged or ask your own question.