title: Get input value inside a form depending on which button is clicked
body: <p>I've got the following form:</p>
  
  <pre><code>&lt;div&gt;
    &lt;form name="ajaxformname" id="ajaxform" action="/request" method="POST"&gt;
      AJAX:
      &lt;input id="btn1" name="feeling" type="submit" value="Fine"&gt;
      &lt;input id="btn2" name="feeling" type="submit" value="Neutral"&gt;
      &lt;input id="btn3" name="feeling" type="submit" value="Bad"&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>which should be posted to a server via ajax. </p>
  
  <p>Here is the associated javascript:</p>
  
  <pre><code>$('#ajaxform').submit(function (event) {
      event.preventDefault();
          var form = $(this); 
          var action = form.attr("action"), 
              method = form.attr("method"),
              data = form.attr("value");
  
      $.ajax({
          url: "/request",
          type: method,
          data: data
      });
  </code></pre>
  
  <p>Now - depending on which of the three buttons has been clicked - I want their values to be posted to the server. But <code>form.attr("value")</code> just gives me the value of the form but not of the input field. </p>
  
  <p>Any suggestions? A solution would be to create the different forms but that doesn't seems to be DRY ... </p>