0

I am trying to get the data I got from a method-and send it to the vue-model where it is defined. I have no idea what I am doing wrong because, it works if the data is already there, but trying to push it back--using vm...does not work. I want to get the data from myenrollemnts put in the the model and use it as a variable so that I can place in the hyperlink as a variable..any help

new Vue({
  el: "#app",
  data: {
   myEnrollments:'',
   myScore:''
  },
  mounted:function(){
  this.getMyEnrollments();
  this.getMyUrl();
  },
  methods: {
    getMyEnrollments:function(){
    var vm = this;
    
                    $.ajax({
                        url: "https://www.example.com/users/myinfo",
                        type: 'Get',
                        headers: {
                            accept: "application/json;odata=verbose"
                        },
                        success: function(data) {
                           console.log(data);
                            vm.FirstName = data.FirstName;
                            vm.ProfileIdentifier=data.ProfileIdentifier;
                            vm.Identifier=data.Identifier;
                            vm.myEnrollments=data.myEnrollments;

    
                        }
                    })
    },
        getMyUrl:function(){
    var vm = this;
    
                    $.ajax({
                        url: "https://www.example.com/users/myURL/"+this.$root.$data.myEnrollments+"/orgUnits",
                        type: 'Get',
                        headers: {
                            accept: "application/json;odata=verbose"
                        },
                        success: function(data) {
                           console.log(data);
                         

    
                        }
                    })
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <h2>Todos:</h2>
  
</div>
Vzupo
  • 1,388
  • 1
  • 15
  • 34
  • You maybe ditch `$.ajax` and use something native like `fetch` or even install `axios`. Here is an example with `fetch`: https://codesandbox.io/s/blissful-field-kjufc?file=/src/App.vue – kissu Feb 02 '21 at 20:02
  • What happens when you run it? – Bernardo Duarte Feb 02 '21 at 20:08
  • it doesn't assign the data to the model but if I manually add it inside of the quotes---it displays.... I need a way to get the data to the model.. myEnrollments:'222" if I add 222 in the model manualll--it will work. – Vzupo Feb 02 '21 at 20:09
  • You are making your second asynchronous call in 'getMyUrl()' without know if the asynchronous call in 'getMyEnrollments()' has resolved yet. As the comment suggested, you might want to use axios, and then read up on how to chain asynchronous calls. https://stackoverflow.com/questions/44182951/axios-chaining-multiple-api-requests Also, you should be able to access 'this.myEnrollments' and not have to use 'this.$root.$data.myEnrollments' – Tim Feb 03 '21 at 02:10

0 Answers0