CODEWITHSUNDEEP
angularjs-directive
vivek
vivek

Reputation: 393

Getting form name into directive

I have a modal pop up.To open modal pop up i have a following code

mymodule.directive('modalDialogSite', function() {
  return {
    restrict: 'E',
    scope: {
      show: '='
    },
    replace: true, 
    transclude: true,
    link: function(scope, element, attrs) {
      scope.dialogStyle = {};
      if (attrs.width)
        scope.dialogStyle.width = attrs.width;
      if (attrs.height)
        scope.dialogStyle.height = attrs.height;
        if (attrs.overflow)
        scope.dialogStyle.overflow = attrs.overflow;
      scope.hideModal = function() {
        scope.show = false;
      };
    },
    template: "<div class='ng-modal' ng-show='show'><div class='ng-modal-overlay'></div><div class='ng-modal-dialog' ng-style='dialogStyle'><div class='ng-modal-close' ng-click='hideModal()'><i class='fa fa-times-circle'></i></div><div class='ng-modal-dialog-content' ng-transclude></div></div></div>"
  };
});

In view page the code like below

<a data-toggle="modal" role="button" class="btn btn-success" ng-click="add_site()" data-backdrop="static"><i class="icon-bookmark"></i><b>Add Site</b></a>

<modal-dialog-site show='modalShown_site'>
          <?php echo $this->load->view('sites/modal_sites/content/add_website');?>
</modal-dialog-site>

When i click this button it goes to add_site() function in my controller i have given code like below

mymodule.controller('myCtrl',function($scope){

    $scope.modalShown_site = !$scope.modalShown_site;

    $scope.add_sute = function()
    {
        $scope.modalShown_site = ! $scope.modalShown_site;
    }

});

Actually i have load my form here 

<modal-dialog-site show='modalShown_site'> <?php echo $this->load->view('sites/modal_sites/content/add_website');?‌​> </modal-dialog-site>

and my form will be like

<form id='frmAddSite' name='frmAddSite' novalidate angular-validator angular-validator-submit="add_website(frmAddSite)" class="form-horizontal form-validate"  method="POST">
        <label for="textfield" class="control-label">Name</label>
        <input name='site_name' ng-model="text.site_name" required required-message="'Site name  is required'" type="text">
    <input type="submit"  class="btn btn-primary" value="Submit">
    <button type="button" ng-click="frmAddSite.reset();add_site_cancel()" class="btn" data-dismiss="modal" aria-hidden="true">cancel</button>
</form>

In this scenario how can get the form name into directives?

Upvotes: 1

Views: 414

Answers (1)

Maher
Maher

Reputation: 2547

In this sample, we create a directive to get the some attributes name,id of a element form

    app.directive('myDirective', function () {
        return {
            transclude: true,
            template: '<div class="something" ng-transclude></div>',
            link: function(scope, element) {
                var formName = element.find("form").attr("name");
                var formId = element.find("form").attr("id");
                console.log(formName);
                console.log(formId);
            }
        }
    });

Upvotes: 1

Related Questions