2016-08-31 4 views
0

Ich simuliere Keypress-Ereignis und Bindung an das Eingabeelement, aber die Login-Schaltfläche kann immer noch nicht verwenden.Wie Übergeben Eingabe leere Validierung in Iframe

Hier ist die Testadresse: http://124.207.226.122:21701/test.html.

Meine Frage ist, wie die Eingabe leere Validierung in Iframe übergeben.

Danke.

Mutter Seite:

<body> 
    <div style="margin:0;"> 
     <iframe id="hk_iframe" src="Ng-Click-1.html" frameborder="0" width="100%" Height="768" scrolling="no">do not support iframe</iframe> 
    </div> 

    <script type="text/javascript"> 
     jQuery.fn.simulateKeyPress = function(character) { 
      jQuery(this).trigger({ type: 'keypress', which: character.charCodeAt(0) }); 
     }; 

     $(function() { 
      $('#hk_iframe').load(function(){  
       var $iframe = $(this), 
       $contents = $iframe.contents(); 
       window.setTimeout(function(){ 
        $contents.find('#textbox').keypress(function(e) { 
         //alert(String.fromCharCode(e.which)); 
         console.log(e); 
        }); 
        $contents.find('#textbox').simulateKeyPress('x');   
        $contents.find('#textbox').val('user1'); 

        $contents.find('#password').keypress(function(e) { 
         //alert(String.fromCharCode(e.which)); 
         console.log(e); 
        }); 
        $contents.find('#password').simulateKeyPress('x');   
        $contents.find('#password').val('user123456'); 

        $contents.find('#login').click(); 
       }, 1000); 
      }); 
     }); 
    </script> 
</body> 

Kind Seite:

<body ng-app=""> 
    <form name="form"> 
     <div ng-hide="isShow"> 
      User Name <input type="text" required ng-model="userName" id = "textbox"/><br /><br /> 
      Password <input type="password" required ng-model="password" id="password"/><br /><br /> 
      <input type="button" ng-disabled="form.$invalid" ng-click="isShow = true" value="Login" id="login"/> 
     </div> 
     <div ng-show="isShow"> 
      Successfully Login.<br /> 
      <input type="button" ng-click="isShow = false;password='';userName=''" value="Logout" /> 
     </div> 
    </form> 
</body> 
+0

Sie nie Ihre Form validieren. Bitte lesen Sie die Dokumentation: https://docs.angularjs.org/api/ng/directive/form –

Antwort

0

Danke Michael Walter, du hast recht. Auch ich nahm Bezug auf diese Antwort: Angularjs: call other scope which in iframe

Hier ist meine Antwort:

übergeordnete Seite:

<body> 
    <div style="margin:0;"> 
     <iframe id="hk_iframe" src="Ng-Click-1.html" frameborder="0" width="100%" Height="768" scrolling="no">do not support iframe</iframe> 
    </div> 

    <script type="text/javascript"> 
     $(function() { 
      $('#hk_iframe').load(function(){  
       var $iframe = $(this), 
       $contents = $iframe.contents(); 
       window.setTimeout(function(){     
        $contents.find('#textbox').val('user1');  
        $contents.find('#password').val('user123456'); 

        var $scope = document.getElementById("hk_iframe").contentWindow.angular.element("#formID").scope(); 
        $scope.form.textbox.$setValidity('required', true); 
        $scope.form.password.$setValidity('required', true); 
        $scope.$apply(); 

        $contents.find('#login').click(); 
       }, 1000); 
      }); 
     }); 
    </script> 
</body>