0

I have a following html:

<div ng-app="app" ng-controller="NeuesDokumentCtrl" >
    <table cellpadding="0" cellspacing="0" border="0" >
        <tbody>
            <tr>
                <td>
                    <textarea ng-model="kunde"></textarea>
                </td>
                <td>
                    <img src="/_layouts/15/images/checkitems.gif" ng-click="copy(kunde)" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" ng-model="searchField" />
                </td>
                <td>
                    <img src="/_layouts/15/images/delete.gif" ng-click="delete()" />
                </td>
            </tr>
        </tbody>
    </table>
</div>

My Controller has:

$scope.kunde;
$scope.searchField;

$scope.copy = function (value) {
    $scope.searchField = value;
}
$scope.delete = function () {
    $scope.searchField = "";
}

When I test it in a normal page (NOT a SharePoint page) it works.
In Sharepoint it works if I don't edit the second field manually by typing in something.

I write something in the first box. When clicking on the first IMG the value gets copied into the second box. When I click on the second IMG the second box gets cleared. But when I write something in the second box, the two IMGs stop working - the angular functions are called but the model searchField doesn't display the right information.

I get no errors in the console.

Here's a fiddler

Improve this question
8
  • do you get any errors, on the developer console
    – Swayam Siddha
    Commented Sep 18, 2015 at 11:43
  • No, no errors are shown in the console.
    – Emaborsa
    Commented Sep 18, 2015 at 11:46
  • You can try this, update angularJS to 1.4.x, and surface the html in a content editor webpart
    – Swayam Siddha
    Commented Sep 18, 2015 at 11:49
  • My implementation is built with angular 1.4.x and it works just fine
    – Swayam Siddha
    Commented Sep 18, 2015 at 11:50
  • Is your code implemented in SP? How do you load the controller?
    – Emaborsa
    Commented Sep 18, 2015 at 11:51

1 Answer 1

Reset to default
1

Follow these steps :

  1. Create an empty aspx page (throught sharepoint designer)
  2. port over your angular implementation to that.

The <head> contains

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>

then

  <script>
    (function() {
            var myApp = angular.module('app',[]);
            myApp.controller('NeuesDokumentCtrl',NeuesDokumentCtrl )
            function NeuesDokumentCtrl($scope) {

            $scope.kunde;
            $scope.searchField;

            $scope.copy = function (value) {
                $scope.searchField = value;
            }
            $scope.delete = function () {
                $scope.searchField = "";
            }

        };
}());
</script>

The <body> contains

        <div ng-app="app" ng-controller="NeuesDokumentCtrl" >
            <table cellpadding="0" cellspacing="0" border="0" >
                <tbody>
                    <tr>
                        <td>
                            <textarea ng-model="kunde"></textarea>
                        </td>
                        <td>
                            <img src="/_layouts/15/images/checkitems.gif" ng-click="copy(kunde)" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="text" ng-model="searchField" />
                        </td>
                        <td>
                            <img src="/_layouts/15/images/delete.gif" ng-click="delete()" />
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>

Check in the browser to see if its running fine or not.

  1. Then go to the page with master page where you want to surface this implementation.
  2. Edit the page > add a page viewer wepart and set its source as the above aspx page. Detailed instruction here

Your implementation should work fine :)

Improve this answer

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.