0

i have just made a function that editing html table elements in angular javascript

        $scope.divider = function () {

        var table = document.getElementById("table1");
        var finalpos = "";
        var div = "";
        var divs = "";
        var finals = "";
        for (var i = 0; i < $scope.tasks.length; i++) {
            divs = "";
            for (var x = 0; x < $scope.columns.length; x++) {
                var tds = table.getElementsByTagName("td")[x].innerHTML;
                var pos1 = tds.search('<div');
                var pos2 = tds.search('</div>');
                if (pos1 == -1 || pos2 == -1) {
                    pos1 = tds.search('<!-- ng');
                    pos2 = tds.search('s -->');
                    div = tds.substr(pos1, pos2 - pos1 + 5);
                    var c1 = tds.substr(0, pos1 - 1);
                    var c2 = tds.substr(pos2 + 5, tds.length);
                } else {
                    div = tds.substr(pos1, pos2 - pos1 + 6);

                    var c1 = tds.substr(0, pos1 - 1);
                    var c2 = tds.substr(pos2 + 6, tds.length);
                }
                finalpos = c1 + c2;
                table.getElementsByTagName("td")[x].innerHTML = finalpos;
                div = ' <td ng-repeat="c in columns"> ' + div + ' </td> ';
                divs = divs.concat(div);
            }
            divs = ' <tr > ' + divs + ' </tr> ';
            console.log(divs);
            finals = finals + divs;

        }
        table.getElementsByTagName("tr")[1].outerHTML = finals;
        //console.log($scope.tasks);

    }

and after that all angular functions stopped working (ignored).

this html codes after editing :

<tr>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-danger btn-block" data-toggle="modal" data-target="#myModal">asdasdsa</h4>
    </div>
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">nfnfhgfh</h4>
    </div>
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">zzncvbzxnbn</h4>
    </div>
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-danger btn-block" data-toggle="modal" data-target="#myModal">zxhkcjhzxkjch</h4>
    </div>
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">mdf,n,mdfn</h4>
    </div>
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">werew</h4>
    </div>
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngRepeat: t in tasks track  by $index -->
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-danger btn-block" data-toggle="modal" data-target="#myModal">nbb bv</h4>
    </div>
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">وليد 32324</h4>
    </div>
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngRepeat: t in tasks track  by $index -->
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <div ng-if="c.columnid == t.transstatus" ng-click="gettask(t)" ng-repeat="t in tasks track  by $index" class="redips-drag ng-scope" valign="top" style="border-style: solid; cursor: move;">
        <h4 style="height:50px;" class="btn btn-info btn-block" data-toggle="modal" data-target="#myModal">sjkcsjkh</h4>
    </div>
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngRepeat: t in tasks track  by $index -->
    <!-- ngIf: c.columnid == t.transstatus --
    <!-- end ngIf: c.columnid == t.transstatus -->
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus --
    <!-- end ngIf: c.columnid == t.transstatus -->
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus --
    <!-- end ngIf: c.columnid == t.transstatus -->
</td>
 </tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus --
    <!-- end ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus --
    <!-- end ngIf: c.columnid == t.transstatus -->
    </td>
</tr>
<tr>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
</td>
<td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus --
    <!-- end ngIf: c.columnid == t.transstatus -->
    </td>
    <td ng-repeat="c in columns">
    <!-- ngIf: c.columnid == t.transstatus -->
    </td>
</tr>

and after that ng-click and other functions stopped working.

4
  • I think it's better that define a template that have a columns array in scope. and in it's template use your partial html code. Commented Jul 18, 2017 at 11:26
  • how can i do that? Commented Jul 18, 2017 at 11:27
  • see this stackoverflow.com/questions/18559271/… and (stackoverflow.com/questions/22030080/… Commented Jul 18, 2017 at 11:27
  • i recompile the codes but ng-repeat in every '<td'> run so every line is duplicates Commented Jul 18, 2017 at 13:27

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.