Directives

mwFormBuilder directive

Available attributes:

• formData - object with form definition (required)
• readOnly - boolean (optional)
• options - additional options object (optional)
• onImageSelection - callback on image selection button click, has to return promise with image src (optional)
• api - API object (optional)

options

questionTypes

Array of strings. Used to specify available question types.

All possible values:

   options = {questionTypes:  ['text', 'textarea', 'radio', 'checkbox', 'grid', 'priority', 'division', 'number', 'date', 'time', 'email', 'range', 'url']}

elementTypes

Array of strings. Used to specify available element types.

All possible values:

   options = {elementTypes:  ['question', 'image', 'paragraph']}

elementButtons

Array of objects. Used to specify buttons located on the top right, with the possibility of callback (click event) on the element. and filter to show or hide.

example:

   ctrl.callback = function(element){
    console.log(element);
   };
   ctrl.filter = function(element){
      return (element.question.type === 'text');
   };
   options = {elementButtons:   [{title: 'My title tooltip', icon: 'fa fa-database', text: '', callback: ctrl.callback, filter: ctrl.filter}]}

customQuestionSelects

Array of objects. Used to specify available selects under question type. It can be used as a category, etc.

All possible values:

   options = {customQuestionSelects:  [
               {key:"category", label: 'Category', options: [{key:"1", label:"Uno"},{key:"2", label:"dos"},{key:"3", label:"tres"},{key:"4", label:"4"}] },
               {key:"category2", label: 'Category2', options: [{key:"1", label:"Uno"},{key:"2", label:"dos"},{key:"3", label:"tres"},{key:"4", label:"4"}]}
           ]}

key is located in element.question[key]. track by selects item key.

onImageSelection

Simple example:

    options.onImageSelection = function (){
            var d = $q.defer();
            var src = prompt("Please enter image src");
            if(src !=null){
                d.resolve(src);
            }else{
                d.reject();
            }

            return d.promise;
        };

api

Available methods:

• reset()

Events

Happen while you are designing. Allows you to control the navigation and add new pages for the form.

• mwForm.pageEvents.pageRemoved
• mwForm.pageEvents.pageMoved
• mwForm.pageEvents.pageAdded
• mwForm.pageEvents.pageNameChanged
• mwForm.pageEvents.pageCurrentChanged

example:

   $scope.$on("mwForm.pageEvents.pageCurrentChanged", function (e, data) {
            $scope.sectionIndex = data.index;
        });

• mwForm.pageEvents.changePage: Change the current page. example:

  $rootScope.$broadcast('mwForm.pageEvents.changePage', {page: page});

mwFormViewer directive

Attributes:

• formData - object with form definition (required)
• responseData - object with response data (required)
• onSubmit - form submit callback, has to return promise (required)
• readOnly - boolean (optional)
• options - additional options object (optional)
• formStatus - object, wrapper for parent angular form object (optional)
• api - API object (optional)

api

Available methods:

• reset()