0

I need help with my contact formular on http://robert-richter.com under the navigation point Kontakt. I want to send this form with different subjects. Dependung on with option is selected in the drop down menu, I want to create an individual subject. The reason why I want to do this is because I want to use a filter in my email account wich saves emails based on the sibject title.

Example:

Contact Form Name: John Alex Option Selected: Anfrage persönlich // german for private request

Subject in Mailbox: Persönliche Anfrage von Alex John 23/08/2013

Filter 'Persönliche Anfrage von' and save it in the folder 'Persönliche Anfragen' (eng: Private Requests)

Im brand new to jQuery. This is what I got so far:

<form action="#" method="post" title="Kontaktformular" class="ajax">
<div><label for="name">Name</label>
    <input name="name" type="text" title="Name"></div>
<div><label for="email">E-Mail-Adresse</label>
    <input name="email" type="text" title="Email"></div>
<div><label for="auswahl">Präfix</label>
<label class="label">
    <select name="auswahl" class="dropdown">
    <option selected value="Webdesign">Anfrage Webdesign</option>
    <option value="Persoenlich">Anfrage persönlich</option>
    <option value="Andere">Alles andere</option>
    <option value="Spam">Spam</option>
    </select>
    </label></div>
    <div><textarea name="message" title="Nachricht"></textarea></div>
<button value="Send" type="submit" class="button">Absenden</button>
</form>

//php file
<?php
if (isset($_POST['name'], $_POST['email'],$_POST['auswahl'], $_POST['message'])) {
    print_r($_POST);
}

$('form.ajax').on('submit', function() {
var that = $(this),
    url = that.attr('action'),
    type = that.attr('method'),
    data = {};

that.find('[name]').each(function(index, value) {
    var that = $(this),
        name = that.attr('name'),
        value = that.val();

    data[name] = value;
});

$.ajax({
    url: url,
    type: type,
    data: data,
    success: function(response) {
        console.log(response);
    }
});
return false;

});

http://jsfiddle.net/c5C8F/2/

How can I add the selected option instead of the select element?

4

3 回答 3

1

尝试

$('form.ajax').on('submit', function() {
    var that = $(this),
        url = that.attr('action'),
        method = that.attr('method'),
        data = {};

    that.find('[name]').each(function(index, value) {
        var that = $(this),
            name = that.attr('name'),
            value = that.val();

        data[name] = value; // need to assign value instead of name
    });
    console.log(data);      
    return false;
});

如果您想将所有选定的值作为参数列表尝试

console.log(that.serialize())
于 2013-08-23T13:51:12.100 回答
1

试试这个：如果你想在实现时这样做，那么像这样更新你的代码：

$('form.ajax').on('submit', function() {
    var that = $(this),
        url = that.attr('action'),
        type = that.attr('method'),
        data = {};

    that.find('[name]').each(function(index, value) {
        var that = $(this),
            name = that.attr('name'),
            value = that.val();

        var isSelect = that.find("select");
        if(isSelect.length > 0){
            value = isSelect.val();
        }

        data[name] = value;
    });
    console.log(data);
    return false;
});

但问题是，您正在遍历表单中的每个输入，并将数据存储在数组中的 keyValue 对中。如果您只是像这样将代码更新到下面，那么您不必手动执行此操作，因为 jQuery 会为您完成：

 $('form.ajax').on('submit', function() {
    var that = $(this),
        url = that.attr('action'),
        type = that.attr('method'),
        data = {};

    data = that.serialize(); //it will return each input in string concatenation

    //Or,

    data = that.serializeArray(); //it will return each input in object array

    console.log(data);
    return false;
});

您可以选择最适合您的方法。

我希望它有帮助

于 2013-08-23T13:53:06.180 回答
0

要获取所选选项的值，您可以执行以下操作：

// Get the select box.
var $select = $(this).find("select[name='auswahl']");
// Get the selected option.
var $selectedOption = $select.find(":selected");
// Get the value of the selected option.
var selectedOptionValue = $selectedOption.val();
于 2013-08-23T13:55:10.047 回答