代码之家 › 专栏 › 技术社区 › ASP.net and angularjs

无法从代码中看到使用AngularJS动态创建的文本框的值

angularjs-ng-repeat angularjs c#

ASP.net and angularjs · 技术社区 · 7 年前

我是AngularJS编程新手。任何帮助都将不胜感激。

每次单击HTML按钮时,都会创建一个HTML文本框。
在里面 webform1.aspx 提交按钮单击甚至无法捕获在这些文本框中输入的值。

我用过 request.form ,循环通过中的控件 form1 但找不到动态创建的控件。

如何从代码隐藏中发布和查看在这些文本框中输入的数据?

请查找以下代码:

webform1.aspx

<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
      <script src="https://raw.githubusercontent.com/eligrey/FileSaver.js/master/FileSaver.js"></script>
   </head>
   <body>
      <form id="form1" runat="`server">
         <div>
         <div ng-app="myApp" ng-controller="myCtrl">
            <li ng-repeat="element in elements ">
               <input type="text" ng-model="element.id" runat=server/>
            </li>
            <input type="button" value="+" ng-click="newItem()" />
         </div>
      </form>
   </body>
   <script language="JavaScript">
      var app = angular. Module('myApp', []);
      app.controller('myCtrl', function ($scope) {
          var counter = 0;     
          $scope.elements = [{ id: counter, value: ''}];

          $scope.newItem = function () {
              if ($scope.elements[counter].value != '') {
                   counter++;
                   var str1 = 'txtdynamic';
                   str1 += counter;
                   $scope.elements.push({ id: str1, value: '' });
              }
          }
      });
   </script>
</html>

webform1.aspx。反恐精英

protected void Button2_Click(object sender, EventArgs e)
{
    //get the html ng repeat textbox control values
}

1 回复 | 直到 7 年前

lin 7 年前

我的朋友,请用正确的方式尝试。将以下代码与您的方法进行比较。

> demo fiddle .

看法

<div ng-controller="myCtrl">
  <form id="form1" runat="`server">
    <div>
      <div ng-app="myApp" ng-controller="myCtrl">
        <li ng-repeat="element in elements">
          <input type="text" ng-model="elements[element.id].value" runat=server/>
        </li>
        <input type="button" value="+" ng-click="newItem()" />
        <input type="button" value="send" ng-click="ButtonClick()" />
      </div>
    </div>
  </form>
</div>

AngularJS应用程序

  var app = angular.module('myApp', []);
  app.controller('myCtrl', function($scope, $http) {

    var counter = 0;

    $scope.elements = [{
      id: counter,
      value: ''
    }];

    $scope.newItem = function() {
      if ($scope.elements[counter].value != '') {
        counter++;
        var str1 = 'txtdynamic';
        str1 += counter;
        $scope.elements.push({
          id: str1,
          value: ''
        });
      }
    }

    $scope.ButtonClick = function() {
      var post = $http({
        method: "POST",
        url: "/Home/AjaxMethod",
        dataType: 'json',
        data: {
          id: angular.isDefined($scope.elements[0]) ? $scope.elements[0].value : null
        },
        headers: {
          "Content-Type": "application/json"
        }
      });
    }
  });

推荐文章

learner · 如果超出限制,AngularJS ui select multiple应显示警报

2 年前

Onyx · 外部和内部div都有ng click,当我单击内部div时,两个ng click都会执行。如何预防?

2 年前

Michlut · Angular JS——从表单上传文件,并作为json对象的一部分与其他数据一起发送

2 年前

jieunbi · 按日期排序数组(最新优先)

2 年前

StackoverflowNinja · 当数字框的值在AngularJS中更改时更改下拉列表的值

2 年前

Stradosphere · 如何防止ng bind html添加结束标记?

6 年前

Celestialchippy · 如果事情是真的,如何创建一个“<a>”链接?

6 年前

a4aravind · Angulari如何使用java驱动程序访问元素?

6 年前

Nicoleta Wilskon · DecodeURIComponent不支持%uxxx编码的组件

6 年前

Nishant Florentin · 在AngularJS中发生ng if、ng show等之后,我该如何做一些动作?

6 年前