Question

guys.
I’m trying to call some AJAX Post trhu AngularJS, and I want to send all properties from my $scope variable. I have this form:

<div ng-controller="DiscountPrintsCtrl">

    <div>
    Choose the year:
    <select ng-model="selectedYear" ng-change="searchCourses()">
        <option ng-repeat="year in years" value="{{year.ID}}">{{year.Name}}</option>
    </select>
</div>

<div>
    Choose the course:
    <select ng-model="selectedCourse" ng-change="searchStudents()">
        <option ng-repeat="course in courses" value="{{course.ID}}">{{course.Nome}}</option>
    </select>
</div>

<div>
    Choose the student:
    <select ng-model="selectedStudent" ng-change="searchStudentDetails()">
        <option ng-repeat="student in students" value="{{student.ID}}">{{student.Name}}</option>
    </select>
</div>

<div ng-model="studentDetails">
    Details about the student:<br /><br />
    <label>Name: {{studentDetails.Name}}</label><br />
    <label>Number: {{studentDetails.Number}}</label><br />
    <label>Print quote: {{studentDetails.PrintQuote}}</label><br />
</div>

<div>
    <table>
        <thead><tr>
            <td></td>
            <td>Title</td>
            <td>Grade</td>
            <td>Summary</td>
            <td>Author</td>
            <td>Number of pages</td>
        </tr></thead>
        <tbody>
            <tr ng-repeat="publication in publications">
                <td><input type="checkbox" ng-model="publication.Selected" /></td>
                <td>{{publication.Title}}</td>
                <td>{{publication.Grade}}</td>
                <td>{{publication.Comments}}</td>
                <td>{{publication.Author}}</td>
                <td>{{publication.NumberOfPages}}</td>
            </tr>
        </tbody>
    </table>
</div>

<button ng-click="submitForm()" value="Confirm discounts" />

And I have this JS:

<script type="text/javascript">

function DiscountPrintsCtrl($scope, $http) {


    $http.get(url).success(function (years) {

        $scope.years = years;
        $scope.selectedYear = '';

    });

    $scope.searchCourses = function() {

        var url = '/json/GetCoursesFromYear?' + 
            'selectedYear=' + $scope.selectedYear;
        $http.get(url).success(function (courses) {
            $scope.course = courses;
            $scope.selectedCourse= '';
        });
    }

    $scope.searchAlunosAnoSemestre = function() {

        var url = '/json/GetStudentsFromCouse?' +
            'selectedCourse=' + $scope.selectedCourse;

        $http.get(url).success(function(students) {
            $scope.students = students;
            $scope.selectedStudent = '';
        });
    }

    $scope.searchStudentDetails = function() {

        var url = '';

        url = '/json/GetStudentDetails?' +
            'selectedStudent=' + $scope.selectedStudent;

        $http.get(url).success(function(studentDetails) {
            $scope.studentDetails= studentDetails;
        });

        url = '/json/GetPublicationsForStudent?' +
            'selectedStudent=' + $scope.selectedStudent;
        $http.get(url).success(function(publications) {
            $scope.publications = publications;
        });
    }

    $scope.submitForm = function () {
        // How to submit the entire $scope???
    }
}

Any idea? Any considerations about my JS code??
Thanks all!!!

Answer 1

You have typos to fix, friend:

In the .js:
$scope.course = courses;
Should be $scope.courses!

In the html:
{{course.Nome}}
Shouldn’t it be:
{{course.Name}}
?

I see some Spanish (?) above there but everywhere else you say .Name so it’s best to be consistent, right?

That said, it seems fine to load an object into your $scope from the external json data store as you seem do be doing in each function, loading from the json URLs. The commenters on your post didn’t seem to recognize this? I think they believe you’re trying to permanently store this data in $scope? Maybe I’m not seeing something that they are… but if you don’t add your data model object sometime into $scope.something then {{something}} simply won’t work, and neither will {{something.else}}.

Am I way off base here?