2016-07-07 6 views
0

フォームの(またはdivの)HTML全体を各コントロールの値を含めて取得したいと考えています。私はinnerHtml/outerHtmlを試しました。彼らは私にHTMLを与えても、コントロールの値を取得することはできません。属性とフォームの値を含むHTML全体を取得する方法

ビジネスシナリオ:異なるHTMLフォームを読み込むためのプレースホルダ( "loadHtml")を持つランディングページがあります。ユーザーの要求に基づいて、標準HTMLフォームをサーバーから取得し、「loadhtml」div内にロードし、さまざまなフィールドにユーザー全体のデータを格納します。ユーザーがデータ入力を完了して「保存」をクリックすると、値と共にHTML(テキストボックス&チェックボックスを含む)を抽出し、それをサーバーに送信してHTMLフォームとして保存したいと思います。あなたは、HTMLページに$http.getを実行し、単に使用してそれを表示することができ

<div id="loadHtml"></div> 

<div class="form-group"> 
    <div class="col-sm-offset-4"> 
    <button class="btn btn-success" ng-click="save()">Save</button> 
    </div> 
</div> 
+0

可能な複製(http://stackoverflow.com/questions/14357222 [値を含む入力コントロールのinnerHTMLプロパティを取得する方法?]/input-control-in-the-value-in-the-get-of-the-valueを含む) –

+0

既にサーバーから取得している場合は、ポストバックして保存してください。 –

+0

フォームのsubmitイベントで 'innerHTML'を取得します。 – Iceman

答えて

0

まあ、私はよく理解しても、別のページの全体のHTMLを取得し、それを表示したいので、ここでの方法ですngSanitizeが表示されます。ここで

は例です:の

(function() { 
 
    "use strict"; 
 
    angular.module('app', ['ngSanitize']) 
 
    .controller('mainCtrl', function($scope, $http) { 
 
     $scope.html = ''; 
 
     $scope.get_html = function() { 
 
     $http.get('https://httpbin.org/').then(
 
      function(response) { 
 
      $scope.html = response.data; 
 
      }, 
 
      function(response) { 
 
      console.log(response); 
 
      }); 
 
     } 
 
    }); 
 
})();
<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular-sanitize.min.js"></script> 
 
</head> 
 

 
<body ng-controller="mainCtrl"> 
 
    <span ng-bind-html="html"></span> 
 
    <button type="button" ng-click="get_html()">Get entire HTML</button> 
 
</body> 
 

 
</html>

関連する問題