【问题标题】:Grab Data from HTML table and put it into variable从 HTML 表中获取数据并将其放入变量中
【发布时间】:2018-11-29 02:02:48
【问题描述】:

我正在制作一个通过数据库自动填充的表,并使用 angular 循环遍历列表以填充 html 表。我的问题是我想让它在单击一个单元格时打开一个新网页,其中包含与该 jobID 相关的更具体的采石场。

不是我的问题是如何通过 javascript 从 html 表中获取值。我想如果我可以点击我想要的单元格并将 jobID 放入 var 中,我可以完成其他所有事情。

<div align=center>
    <img src = "./img/heatmap.png"></img>   
</div>
<div align=center>
    Job ID:<input type="text" name="jobID" id="jobID"><br><br>
</div>
    <div align=center>
            <table id="Table" class="JobID-table" style="text-align:center" >
                <tr class="table-Header">
                    <th>JOB ID</th>
                    <th>TIME FOR ALL MODULES(MILLISECONDS)</th> 
                 </tr>
                 <tr class="jobID-Table-tr" ng-repeat="p in puller | orderBy : '-modCount'"> 

                        <td ng-click='someFunctionName(p.modName)'class={{p.cellClass}}>
                            {{p.modName}}   
                        </td>
                        <td  class={{p.cellClass}}>

                            {{p.modCount}}

                        </td>


                 </tr>

            </table> 
        </div>  
    <script src = "js/vendor/angular.js"></script>
    <script src = "js/app.js"></script>
    <script src = "js/home-controller.js"></script>

这是控制器:

app.controller("homectrl", function($scope, $http){

    $http.get("rest/performance").then(function(response){

        $scope.puller = response.data;

        for (var i = 0; i < $scope.puller.length; i++) {
            var p = $scope.puller[i];
            console.log("modName: " + p.modName);
            console.log("modClass: " + p.cellClass);
            console.log("modData: " + p.modCount);

        }

        $scope.someFunctionName(cellVal){
            document.getElementById("jobID").value = cellval;

        }

    });


});  

【问题讨论】:

  • 你有什么问题?你有错误吗?
  • 你不应该使用 vanilla js onclick。而是使用 angularJS'ngClick。你能发布控制器代码吗?
  • 顺便说一句,你的代码有这个error。使用ngClick 将修复该错误并使您的代码更好。

标签: javascript html angularjs


【解决方案1】:

您可能想探索ng-click

<td ng-click='someFunctionName(p.modName)'class={{p.cellClass}}>{{p.modName}}</td>
<td ng-click= class={{p.cellClass}}>{{p.modCount}}</td>

在控制器中

$scope.someFunctionName(cellVal){
  // cellValue gives the content of the cell

}

【讨论】:

  • Brk,我收到了 { 花括号的意外标记。我更新了我的代码。
  • 可能是因为这个class={{p.cellClass}}。尝试在引号内加上 {{}}
  • 同样的错误看起来像:home-controller.js:14 Uncaught SyntaxError: Unexpected token { angular.js:14642 Error: [$controller:ctrlreg] 名称为“homectrl”的控制器未注册. errors.angularjs.org/1.6.5/$controller/ctrlreg?p0=homectrl at angular.js:116 at $controller (angular.js:10933) at setupControllers (angular.js:10025) at nodeLinkFn (angular.js:9795) at CompositeLinkFn (angular.js:9149) 等.. .
猜你喜欢
  • 2019-06-20
  • 2015-07-15
  • 2016-03-12
  • 2020-02-09
  • 1970-01-01
  • 2021-06-26
  • 1970-01-01
  • 2015-07-10
  • 2015-04-09
相关资源
最近更新 更多