json-schema-form / angular-schema-form

Generate forms from a JSON schema, with AngularJS!
https://json-schema-form.github.io/angular-schema-form
MIT License
2.47k stars 653 forks source link

Can angular directive be assigned to fields generated by asf? #773

Closed gaganmalhotra closed 7 years ago

gaganmalhotra commented 7 years ago

Have a couple of questions: 1) is there a way to attach a angular directive to angular schema form generated fields? for example, schema:

{
"respondantRole": {
          "type": "string",
          "enum": [
            "Offering manager",
            "Marketing manager",
            "Portfolio manager",
            "Developer",
            "Other"
          ]
        }
}

Form:

{
    "key" : "respondantRole",
    "type" : "select",
    "title" : "What is your relationship to this offering?",
    "onChange":"valChange(modelValue, form)"
  }

Is there a possible way to add ng-click directive to any particular select option, for eg, if I want this function to execute only when 'Developer' option in the checkbox is clicked...how to implement it?

Also how can we attach any other directive to any angular schema generated fields?

2) Schema:

{
  "type": "object",
  "properties": { 
      "input": {
          "type": "string",
          "enum": ['a','b' ]
     }
}

Form:

{
    "key" : "input",
    "type" : "radios",
    "title" : "TitleName",
    "onChange":"inputChange(modelValue, form)"
  },

Right now, when i define a function inputChange in the controller, what i get is the value 'true/false' in the modelValue argument but not the text of the radio button, how can we extract the text ('a' or 'b') in the function definition.

@davidlgj & @Anthropic Thanks.

Anthropic commented 7 years ago

@gaganmalhotra please use the template provided when creating issues and read the support requirements or you may not get an answer. Do not tag individual users in an initial question.

Please create a plunker to show what you are trying to do as it allows someone answering to make a quick change to it and send back to you with possible solution, otherwise we can't se what you are doing wrong.

Also please use markdown formatting for code snippets, I have updated your question to show you how.

gaganmalhotra commented 7 years ago

@Anthropic Thanks for the reply Marcel. i have updated it in Plunker below: https://plnkr.co/edit/30BjICzgFsXlQ3ZgfkUi?p=preview

Please see in app.js where i need to show the value of the checkbox being selected...how to do that using angular schema form.

Also for the second question of mine i have updated it in the same plunker where i want to add any angular provided directive to a text field...how to deal with that situation?

Thanks, Gagan

Anthropic commented 7 years ago

@gaganmalhotra in the plunker the field is of type select not checkboxes, I can see where there may be confusion, as checkbox values are not sent to your function, you can however use the $scope.model within your code as within the console.log below, this will provide you an array of all the selected options

$scope.valChange = function(formKey, modelValue) {
    console.log($scope.model);

= {respondantRole: [ "Marketing manager", "Developer" ]}

Regarding click or focus events we currently only track the change event. If you want to add an additional directive for those events you can always update the template to add that behaviour.

Please re-open if you do not feel the question has been answered sufficiently.