Storing data from a select tag to a string using Javascript

Question

I'm trying to take information out of a form controlled by a select statement and store it in a string. The plan is to send the information gathered from the user via email, which I used PHP to do. I have an idea how to do it (a while loop that's controlled by how many lines are in the list,) but I can't quite gather the information.

Here's the loop:

    var empMessage = function(){
        messageString = "";
        var noEmp = $("#drpEmp option").length;
        var i = 0;
        $("#drpEmp").selector.index = i;    
            while (i < noEmp){
                $("#drpEmp").index = i;
                messageString = messageString + 
                "Name:              " + firstName.val + " " + MI.val + " " + lastName.val +  "<br/>" +
                "Business:          " + BusinessName.val + "<br/>" +   
                "Address:           " + address.val + "<br/>" +
                "                   " + city.val + ", " + state.val + " " + zip.val + "<br/>";
            }
            messageString = "<strong>Employee Information</strong><br/>" . messageString;
            i++; 
        }
        $("#stringHolder").val(messageString);
    }

Here's the JS Fiddle: https://jsfiddle.net/xptxz7by/3/

I know I probably really off. I know I have the loop working and the list is getting counted, but I can't seem to retrieve the information. I'm also thinking I'm approaching sending the information wrong and there's probably a better way of doing it, I just haven't figured out how.

What is `$("#drpEmp").selector.index`? I don't understand what you're doing with that `while` loop. — Barmar, Jun 12 '15 at 21:52
Why are you doing this in JS in the first place? Just submit the form to PHP and let it format the email. — Barmar, Jun 12 '15 at 21:57
@CaptObvious42 Ever thought of saving yourself a headache and just send a json to your php script? This way your php script is the only part that handles the logic for the email content. and that is sent is your form's data. — Dwight Spencer, Jun 12 '15 at 23:29

score 0 · Answer 1 · answered Jun 12 '15 at 22:08

The data you want is in the Employee object that you saved in each option's .data(), so you need to get that data and use the properties.

messageString = "<strong>Employee Information</strong><br/>";
$("drpEmp option:selected").each(function() {
    var employee = $(this).data("employee");
    messageString +=
        "Name:              " + employee.firstName + " " + employee.MI + " " + lastName +  "<br/>" +
        "Business:          " + employee.BusinessName + "<br/>" +   
        "Address:           " + employee.address + "<br/>" +
        "                   " + employee.city + ", " + employee.state + " " + employee.zip + "<br/>";
});

Storing data from a select tag to a string using Javascript

1 Answers1