title: PHP form for designer
body: <p>I don't have any knowledge about PHP. Could anyone help me to make this form working and send mail:</p>
  
  <p>So how I can make this form working with PHP? Can I use Javascript to send form data or must use PHP.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/*start RSVP*/
  .rsvp {
      width: 100%;
      padding: 100px 0;
      background-image: url("../images/rsvp.jpg");
      -moz-background-size: cover;
      -o-background-size: cover;
      -webkit-background-size: cover;
      background-size: cover;
      background-position:30% 40%;
  }
  .rsvp .rsvp-nested{
      background-color:white;
      padding:100px 50px;
  }
  .rsvp .rsvp-nested h1{
      font-size: 50px;
      margin:0;
      margin-bottom: 40px;
      font-weight: bold;
      text-align: center;
      font-family: 'Shadows Into Light', cursive;
      color: rgb(254, 88, 149);
  }
  .rsvp .rsvp-nested p{
      text-align:center;
      font-size:18px;
      font-weight:300;
      font-family:Consolas,Arial;
      margin-bottom:30px;
  }
  .rsvp .rsvp-nested a[href^="mailto"]{
        overflow-wrap: break-word;
  }
  .rsvp .rsvp-nested input{
      color: rgb(254, 88, 149);
      font: 300 14px "consolas", sans-serif;
      width:100%;
      border: none;
      border-bottom: 1px solid #cdc1c1;
      margin-bottom: 50px;
      padding: 8px;
      background-color:transparent;
      outline:rgb(254, 88, 149);
  }
  .select-style {
      overflow: hidden;
      margin-bottom: 50px;
      background: url("../images/arrow.png") right center no-repeat;
      border: none;
      border-bottom: 1px solid #cdc1c1;
  }
  .select-style select {
      color: rgb(254, 88, 149);
      font-size:14px;
      font-family:Consolas;
      padding: 8px;
      width: 100%;
      border: none;
      background: transparent;
      background-image: none;
      box-shadow: none;
      -webkit-appearance: none;
      outline:none;
  }
  .rsvp textarea{
      color: rgb(254, 88, 149);
      font: 300 14px "consolas", sans-serif;
      border: none;
      width:100%;
      border-bottom: 1px solid #cdc1c1;
      margin-bottom: 50px;
      padding: 8px;
      resize:none;
      outline:none;
  }
  .rsvp button[type="submit"]{
      display:block;
      padding:15px 50px;
      margin:auto;    
      border:none;
      outline:none;
      color:rgb(254, 88, 149);
      border:2px solid rgb(254, 88, 149);
      font-size:20px;
      background-color:transparent;
      font-family: 'Shadows Into Light', cursive;
      cursor:pointer;
      transition:all .4s linear;
  }
  .rsvp select option{
      /*text-overflow: ellipsis;*/
  }
  .rsvp button[type="submit"]:hover{
      color:white;
      background-color:rgb(254, 88, 149);
  }
  
  /*end RSVP*/</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/&gt;
      &lt;section id="rsvp" class="rsvp"&gt;
          &lt;div class="container"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-lg-10 col-lg-offset-1"&gt;
                      &lt;div class="rsvp-nested"&gt;
                          &lt;h1&gt;are you attending?&lt;/h1&gt;
                          &lt;p&gt;Please send before &lt;span&gt;December 1st, 2014.&lt;/span&gt;  For any question please email: &lt;br /&gt;
                              &lt;a href="mailto:tutamon_designs@gmail.com"&gt;tutamon_designs@gmail.com&lt;/a&gt;
                          &lt;/p&gt;
                          &lt;form action="/" method="post"&gt;
                              &lt;div class="row"&gt;
                                  &lt;div class="col-lg-6"&gt;
                                      &lt;input type="text" name="name" placeholder="Name" /&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-lg-6"&gt;
                                      &lt;input type="text" name="name" placeholder="Email" /&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-lg-6"&gt;
                                      &lt;div class="select-style"&gt;
                                          &lt;select name="guests"&gt;
                                              &lt;option value="0" disabled="" selected=""&gt;number of attendees&lt;/option&gt;
                                              &lt;option value="1"&gt;1&lt;/option&gt;
                                              &lt;option value="2"&gt;2&lt;/option&gt;
                                              &lt;option value="3"&gt;3&lt;/option&gt;
                                              &lt;option value="4"&gt;4&lt;/option&gt;
                                              &lt;option value="5"&gt;5&lt;/option&gt;
                                              &lt;option value="6"&gt;6&lt;/option&gt;
                                              &lt;option value="7"&gt;7&lt;/option&gt;
                                              &lt;option value="8"&gt;8&lt;/option&gt;
                                          &lt;/select&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-lg-6"&gt;
                                      &lt;div class="select-style"&gt;
                                          &lt;select style="" name="rsvp"&gt;
                                              &lt;option value="0" disabled="" selected=""&gt;Will you be coming&lt;/option&gt;
                                              &lt;option value="yes"&gt;Yes&lt;/option&gt;
                                              &lt;option value="no"&gt;No&lt;/option&gt;
                                          &lt;/select&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-md-12"&gt;
                                      &lt;textarea placeholder="Leave your Message"&gt;&lt;/textarea&gt;
                                  &lt;/div&gt;
                                  &lt;button type="submit" name="theButton"&gt;I'm Attending&lt;/button&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/section&gt;</code></pre>
  </div>
  </div>
  </p>