title: How to get the text of the selected <td> using vue?
body: <p>I have dynamic table where I fetch the data with $.ajax() from a DB. The data from the rows are editable and I need to save the changes of that same content with vue.js. After changing the content, an $.ajax() function with 4 parameters (name, client_id, url and id) is triggered for this. I'm trying to find a way to get the value of the inputs + the id of the database. I have the code in jquery, but i need to make it more Vue-ish. How can I do this?</p>
  
  <p>Here is the HTML of the table:</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;table class="table" id="table"&gt;
  &lt;thead class="head-color thead-inverse"&gt;
      &lt;tr&gt;
          &lt;th style="border-top-left-radius: 10px; border-left:1px solid transparent;"&gt;NAME&lt;/th&gt;
          &lt;th&gt;CLIENT-ID&lt;/th&gt;
          &lt;th&gt;URL&lt;/th&gt;
          &lt;th style="border-top-right-radius: 10px; border-right:1px solid transparent;"&gt;ACTIONS&lt;/th&gt;
      &lt;/tr&gt;
  &lt;/thead&gt;
  &lt;tbody id='table-redirect'&gt;
      &lt;tr class='lightgrey'&gt;
          &lt;!-- v-for to create loop / v-bind to bind data to html --&gt;
          &lt;td class="name1" contenteditable="true"&gt;{ agr.name }&lt;/td&gt;&lt;!--{ data binding } --&gt;
          &lt;td class="client_id1"&gt;{ agr.client_id }&lt;/td&gt;
          &lt;td class="url1" contenteditable="true"&gt;{ agr.url }&lt;/td&gt;
          &lt;td&gt;
              &lt;input id='hidden' name='hidden' type='hidden' value="&lt;?php echo $value-&gt;id;?&gt;"&gt; &lt;button v-on:click="editRedirect(name, client_id, url, id)" class='editButton btn' type="button"&gt;
                 &lt;img class="col-md-2 edit nopad float-right" src="http://mobisteinlp.com/redirect/public/img/edit.svg"&gt;&lt;!-- v-on:click event listener to trigger $.ajax() --&gt;
              &lt;/button&gt;
              &lt;a href='http://mobisteinlp.com/redirect/public/click.php/?id=%3C?php%20echo%20$id;?%3E'&gt;
                  &lt;img class="col-md-2 link nopad float-right" src="http://mobisteinlp.com/redirect/public/img/copy.svg"&gt;&lt;!-- button to generate link --&gt;
              &lt;/a&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p></p>
  
  <p>And here is my current VUE.JS code. It gives success on button click, but the parameters return undefined. Basically I need to get the <code>$.text()</code> of the editable rows.</p>
  
  <p><strong>VUE.JS:</strong></p>
  
  <pre><code>//VARIABLES
  var link = "http://mobisteinlp.com/redirect/redirect";
  agr = 0;
  //VUE.JS REDIRECT VIEW MODEL
  var redirect = new Vue({
          el: '#redirect',
          delimiters: ["{", "}"],
          data: {
              agr1: [],
              agr: [],
              name: '',
              client_id: '',
              redirectUrl: '',
              id: ''
          },
          methods: {
              //FUNCTION TO EDIT DATA FROM TABLE
              editRedirect: function(name, client_id, redirectUrl, id) {
                  var self = this;
                  console.log(name);
                  console.log(client_id);
                  console.log(redirectUrl);
                  console.log(id);
                  var formData = new FormData();
                  formData.append('name', client_id, redirectUrl, id);
                  $.ajax({
                      url: link + "/editRedirect",
                      type: "POST",
                      data: {
                          name: name,
                          client_id: client_id,
                          redirectUrl: redirectUrl,
                          id: id,
                      },
                      dataType: "json",
                      success: function(obj) {
                          console.log(obj); //
                          this.agr1 = obj;
                          console.log('success!');
                      },
                      error: function() {
                              console.log('error');
                          } //end error function
                  }); //end editRedirect $.ajax() function
              }, //end editRedirect function
          } //end methods
      }) //end vue.js instance
  </code></pre>