首页 > 解决方案 > 发布一个包含许多字段和 JS var 的表单

问题描述

我想通过 ajax 将我的表单发布到 php,然后从输入中获取值(我做到了,它工作正常)但我也想在一个 ajax 中发布一个 JS 变量。

有我的表格部分。

<form action="new_alias.php" method="post" id="theForm">
                <div class="form-group">
                    <label for="exampleInputEmail1">Wpisz nazwę aliasu</label>
                    <input type="text" name="alias" id="alias" class="form-control" id="exampleInputEmail1"
                        aria-describedby="emailHelp" placeholder="Nazwa aliasu">
                </div>
                <div class="form-group">
                    <label class="col-form-label">Wybierz domenę</label>
                    <?php
                                    if ($resultt->num_rows > 0) {
                                    echo '<select name="name" class="custom-select">';
                                        // output data of each row
                                        while ($row = $resultt->fetch_assoc()) {
                                        echo "<option value='$row[name],$row[id]'>$row[name]</option>";
                                        }

                                        echo '</select>';
                                    } else {
                                    echo "0 results";
                                    }
                                    ?>
                </div>

                <div class="form-group">
                    <label for="exampleInputEmail1">Wpisz adresy docelowe</label>
                    <input type="text" name="source" id="source" placeholder="Adresy mailowe" autocomplete="nope"
                        autocomplete="off" class="typeahead tm-input form-control tm-input-info" />
                </div>

                <button type="submit" name="add" id="add" class="btn btn-primary mt-4 pr-4 pl-4">Utwórz</button>
            </form>

还有我的剧本

<script>
        $(document).ready(function () {
            var tagApi = $(".tm-input").tagsManager({
                hiddenTagListName: 'hiddenTagListA'
            });
            var x = '';
            var test = '';


            jQuery(".typeahead").typeahead({
                name: 'source',
                displayKey: 'source',
                source: function (query, process) {
                    return $.get('ajaxpro.php', {
                        query: query
                    }, function (data) {
                        data = $.parseJSON(data);
                        console.log(data);
                        return process(data);
                    });
                },
                afterSelect: function (item) {
                    tagApi.tagsManager("pushTag", item);
                    x = document.getElementsByName("hiddenTagListA");
                    test = x[0].value;
                    console.log('to jest z afterSlect: ', test);
                }

            });
            $(".btn").click(function (e) {
                e.preventDefault();
                $.ajax({
                    type: "post",
                    url: 'new_alias.php',
                    data: {
                        $("#theForm").serialize()
                    },
                    success: function () {
                        alert("Form Submitted: ");
                    },
                });
            });
        }); 
    </script>

我正在使用 tagsManager 它创建了带有 ID 的隐藏输入hiddenTagListA 我试图将所有值从hiddenTagListAvar中放入test并且它可以工作。但现在我想将此变量也发布到我的 php 中,因为我想将它放入我的数据库中。从表单中获取所有值,但我还必须发布test变量。

在我的控制台中,我从测试中获得价值,例如:(something, something2, something3...用逗号分隔的标签)它可以只是字符串

标签: javascriptphpjqueryajax

解决方案


如果你得到了值test,只需将它放入 ajax

$(".btn").click(function (e) {
    e.preventDefault();
    $.ajax({
        type: "post",
        url: 'new_alias.php',
        data: {
            form: $("#theForm").serialize(),
            hiddenTagListA: test
        },
        success: function () {
            alert("Form Submitted: ");
        },
    });
});

推荐阅读