Angular form inside directive with isolated scope

Question

I have a form like this

<ng-form name="investorQuestionaireForm" ng-show="user && user.investorType">
    <input 
        type="radio" 
        required
        name="recesso" 
        ng-model="investorQuestionaire.recesso" 
        ng-change="investorQuestionaireValidation('recesso', investorQuestionaireForm)"/> 
    <input 
        type="radio" 
        required
        name="recesso" 
        ng-model="investorQuestionaire.recesso"
        ng-change="investorQuestionaireValidation('recesso', investorQuestionaireForm)"/>
</ng-form>

This form is inside a directive:

angular.module('crowdcoreApp').directive('investorForm',function(){
    templateUrl: 'views/template/equity_investor_form.html',
    restrict: 'E',
    scope: {
        project: '=project'
    },
});

The problem I'm facing is that when I click on the radio button, the value of investorQuestionaire.recesso is not updated, the ng-changefunction is not triggered and most of all the radio button, still result as pristine (both in the html class and in the directive scope). I think that there are some problems with the data binding...

Any suggestion on the possible fault of this behavior?

rmuller · Accepted Answer · 2014-12-04 12:53:21Z

1

Your radio buttons do not seem to have values.

Add some values to your radio buttons and try it again. For example

<ng-form name="investorQuestionaireForm" ng-show="user && user.investorType">
<input 
    type="radio" 
    required
    value="option1"
    name="recesso" 
    ng-model="investorQuestionaire.recesso" 
    ng-change="investorQuestionaireValidation('recesso', investorQuestionaireForm)"/> 
<input 
    type="radio" 
    required
    value="option2"
    name="recesso" 
    ng-model="investorQuestionaire.recesso"
    ng-change="investorQuestionaireValidation('recesso', investorQuestionaireForm)"/>
</ng-form>

answered Dec 4, 2014 at 12:53

rmuller

1,83712 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular form inside directive with isolated scope

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related