phpjqueryformsvalidationjquery-clone

Losing radio values on jQuery cloned form fields


I'm not great with PHP forms and mail functions, but...

I'm trying to build myself and RSVP form (http://adrianandemma.com/) where people can add their name and select yes/no for attending. They can also click a link to RSVP for a further person. If clicked, this clones the name and radios via jQuery.

When the form is submitted I am trying to send the details through to myself via an email. The email is currently submitting and if I receive an email for 3 RSPV names at once, then 3 name values are coming through fine via email, but I only have a value for the first persons yes/no answer.

Can anybody help diagnose why my cloned radio button values aren't being sent via email?

Here's my form:

    <form action="?" method="post">
        <?php if(@$errors) :?>
            <p class="errors"><?php echo $errors; ?></p>
        <?php endif; ?>
        <input type="hidden" name="submit" value="1" />
        <div class="form-row">
            <div class="field-l">
                <p>Name</p>
            </div>
            <div class="field-r">
                <p>Attending?</p>
            </div>
        </div>
        <div class="form-row guest">
            <div class="field-l">
                <input type="text" name="name[]" id="name" value="<?php echo htmlspecialchars(@$_REQUEST['name']); ?>" tabindex="1" />
            </div>
            <div class="field-r">
                <input type="radio" name="coming[]" id="coming-yes" class="coming-yes" value="Yes"><label for="coming-yes">Yes</label><input type="radio" name="coming[]" id="coming-no" class="coming-no" value="No"><label for="coming-no">No</label>
            </div>
        </div>
        <a class="addguest" href="#">Add further guest</a>
        <div class="form-row">
            <button type="submit" id="rsvp-submit" tabindex="2">Submit RSVP</button>
        </div>
    </form>

...and here's my php mail code:

<?php

$name = $_POST['name'];
$coming = $_POST['coming'];

$errors = "";
if(!@$_POST['name'])    { $errors .= "Please enter your name.<br/>\n"; }
if(!@$_POST['coming'])  { $errors .= "Please enter yes or no for attending.<br/>\n"; }

if(@$_POST['emailaddress'] != '')   { $spam = '1'; }

if (!$errors && @$spam != '1')
    {
        $to = "xxx@example.com";
        $subject = "Wedding RSVP";
        $headers = "From: noreply@adrianandemma.com";
        $body = "The following RSVP has been sent via the website.\n\n";
        for($i=0; $i < count($_POST['name']); $i++) {
            $body .= "
            Name ".($i+1)." : " . $_POST['name'][$i] . "\n
            Coming ".($i+1)." : " . $_POST['coming'][$i] ."\n\n";
        }
        $body .= "\n\nDate Received: " . date("j F Y, g:i a") . "\n";

        mail($to,$subject,$body,$headers);
    }

?>

My simple $error validation also seems to have a snag. If i submit the form with nothing filled out at the moment it only shows me the error message regarding the empty radio buttons and not the empty 'name' field, not sure why this is either?

Any help would be really amazing, as I'm struggling to get this finished off.

Thanks :)

...sorry should have included that this is an example of what I'm receiving via email currently if say I receive an RSVP for 3 names:

The following RSVP has been sent via the website.


         Name 1 : Dave Jones

         Coming 1 : Yes


         Name 2 : Amy Jones

         Coming 2 : 


         Name 3 : Carl Jones

         Coming 3 : 


Date Received: 16 April 2017, 2:38 pm

Solution

  • I've taken a look at the html being generated by your misc.js javascript and the name attribute is being set to coming[]1,coming[]2.

    What i would suggest is either:

    1) retaining these as coming[]and therefore your request will have coming as an array. You can then loop through this using the same index as name.

    2) Replacing coming[] with coming1,coming2,coming3using your jquery and then dealing with these as separate variables in your PHP.