小编Kev*_*ent的帖子

使用angularjs和jquery创建动态可扩展表

我想使用JQuery创建一个可扩展的表:http://ludo.cubicphuse.nl/jquery-treetable/#examples.

问题是angularjs和jquery之间存在冲突.这是我的html文件:

<table>
   <tbody ng-repeat="row in construct.matrix.rows">
      <tr data-tt-id="row.name">
         <td>{{row.name}}</td>
         <td>
            <button ng-click="newField($index)">Add a Field</button>
            <form ng-submit="addField($index, fieldName, row)" ng-if="choose($index)">
               <input type="text" ng-model="fieldName" name="text" placeholder="New Field" />
            </form>
         </td>
      </tr>
   </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

要使用jquery部分,我使用此标记:

$(document).ready(function() {
   initialize();
});

function initialize() {
   $("table").agikiTreeTable({
      persist : false,
      persistStoreName : "files"
   });
}
Run Code Online (Sandbox Code Playgroud)

我想在开头有一个简单的表,只有一行.在这一行中,用户可以单击一个按钮,然后提交一个新行,该行将是第一行的可扩展行.只是为了看看是否可能,我试图这样做但我明白在提交第一个可扩展行之后我必须回忆起初始化函数.它有效,但如果我想再次进行操作,我会有一些冲突.

看这张图片:

当我重做操作时发生冲突

因此,如果有人有想法解决这个问题,我会很高兴听到它.谢谢

html javascript jquery angularjs expandable-table

5
推荐指数
1
解决办法
4357
查看次数

我的jsp文件找不到我的javascript文件

我的jsp文件找不到我的javascript文件.在这里你可以看到我的jsp文件:

    <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="ressources/js/addMatrix.js"></script>
</head>
<body>
    <div ng-app="App" ng-controller="MainCtrl">
        <p>Add a new element : </p>
        <table>
            <tr>
                <td data-ng-repeat="data in texts">
                    <button>{{data.text}}</button>
                </td>
                <td data-ng-repeat="field in fields">
                    <form ng-submit="submit(text)">
                        <input type="text" ng-model="text" name="text"
                            placeholder="New Category" />
                    </form>
                </td>
                <td>
                    <button ng-click="addNewChoice()">+</button>
                </td>
            </tr>
        </table>
    </div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

我的javascript文件位于文件夹/ WebContent/ressources/js中,jsp文件位于文件夹/ WebContent中.

我的servlet只在get方法中包含这个调用:

this.getServletContext().getRequestDispatcher("/index.jsp").forward(req, resp);
Run Code Online (Sandbox Code Playgroud)

我的web.xml文件如下所示:

 <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
 <servlet>
    <servlet-name>Home</servlet-name>
    <servlet-class>com.pi.servlets.Index</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>Home</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping> …
Run Code Online (Sandbox Code Playgroud)

java jsp servlets

0
推荐指数
1
解决办法
3227
查看次数

标签 统计

angularjs ×1

expandable-table ×1

html ×1

java ×1

javascript ×1

jquery ×1

jsp ×1

servlets ×1