javascript - Angular Js 中的自动填充表单

标签 javascript jquery html angularjs

我正在尝试找到一种方法,通过单击按钮即可使用文本填充表单组。我为此使用 angularJs、JQuery、jsPDF 和 html。数据将被部分预先格式化,例如“感谢您加入我们,如有任何问题请调用此号码”,并且还包含 JSON 数据,例如“致,{{client.name}}”。这是表单组的 html:

`<div class="form-group">
 <label class="control-label" for="flyer-description">Description</label>
 <textarea class="form-control" id="flyer-description"   placeholder="Insert a short description taking care of the available space">This is where Header, Body, and Footer of Letter Go! Please click corresponding button to fill this area.</textarea>
 </div>`

我希望此按钮在单击事件时用所需的文本填充此文本区域:

<tr><td><a ng-href="" class="btn btn-primary">Client Welcome </a></td>

这是我的客户端信息 Controller :

function ClientCtrl($scope, $http) {
$scope.clients = [];
$http.get('/client').success(function(data, status, headers, config) {
    $scope.clients = data;
    if (data == "") {
        $scope.clients = [];
    }
}).error(function(data, status, headers, config) {
    console.log("Ops: could not get any data");
});

但是,不幸的是我对用于实现此类的脚本有点迷失。我相信您需要找到表单的 id,然后插入给定的文本。我不是在寻找任何人为我编写脚本,而是建议使用的方法、指令等。

最佳答案

Angular 方式:

Plunker

我在jquery中做了另一个例子,点击按钮,获取json数据,并设置textarea的值,请参阅plunker查看工作代码:

Plunker

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="style.css" />
    <script data-require="jquery" data-semver="2.2.0" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <textarea></textarea>
    <button>Client Welcome</button>
  </body>

</html>

$(function() {
  $('button').on('click', function() {
    $.getJSON('test.json', function(data) {
      $('textarea').val('Thank you for joining us, for any questions call this number, to ' + data.name);
    });
  });
});

关于javascript - Angular Js 中的自动填充表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37690344/

相关文章:

用于向 Google 地球插件 map 添加/删除地标的 Javascript

javascript - 将 Javascript 和 CSS 组合成 HTML 文件

jquery - 如何在 jQuery 中组合两个过滤器?

javascript - 使用 Javascript 在 localStorage 中存储大型整数数组的最有效方法

html - IE 特定 html 和 CSS 标签/属性列表

javascript - chart.js (v2+) 图例中的返回百分比

javascript - clearTimeout() 无法正常工作

javascript - 为什么在 Angular 中通过 $parse 分配设置值时不触发scope.$watch?

javascript - 我想在 ember.js 的示例待办事项应用程序中嵌套待办事项

javascript - 在溢出的 div 内滚动