单击模式窗体提交按钮不起作用

时间:2018-10-11 20:27:17

标签: javascript jquery html

我创建了一个具有四个下拉列表的模式下拉表单,其中第四个下拉列表包含指向文档的链接,该链接将在用户单击“提交”按钮后显示。所有四个下拉菜单都可以正常工作,但是当单击“提交”按钮时,文档不会显示。该表格只是继续显示。任何帮助表示赞赏。

        var selectedOptions = {};

        $('#link1').on('change', function () {
            var a = $(this).val();
            selectedOptions['1'] = a;
            selectedOptions['2'] = a;
            selectedOptions['3'] = a;
            if (a !== '') {
                for (var i = 0; i < dataSecondSelect[a].length; i++) {
                    $('#link2').append($("<option></option>")
                            .attr("value", dataSecondSelect[a][i])
                            .text(dataSecondSelect[a][i]));
                }
            }
        });

        $('#link2').on('change', function () {
            var a = $(this).val();
            selectedOptions['1'] = a;
            selectedOptions['2'] = a;
            selectedOptions['3'] = a;
            if (a !== '') {
                for (var i = 0; i < dataThirdSelect[a].length; i++) {
                    $('#link3').append($("<option></option>")
                            .attr("value", dataThirdSelect[a][i])
                            .text(dataThirdSelect[a][i]));
                }
            }
        });
        $('#link3').on('change', function () {
            var a = $(this).val();
            selectedOptions['1'] = a;
            selectedOptions['2'] = a;
            selectedOptions['3'] = a;
            if (a !== '') {
                for (var i = 0; i < dataFourthSelect[a].length; i++) {
                    $('#link4').append($("<option></option>")
                            .attr("value", dataFourthSelect[a][i].link)
                            .text(dataFourthSelect[a][i].form));
                }
            }
        });

    $('#clickButton').on('click', function () {
        var error = false;
        $(".error").remove();
        $(".validation-error").removeClass('validation-error');
        $('#myModal select').each(function () {
            // validate first
            if ($(this).val() === "") {
                var _message = "Please select an option";
                $(this).addClass('validation-error');
                $(this).after($('<div class="error"></div>').text(_message));
                error=true;
            }
        });

        if (error) { return; }
        // form is now validated so get the link
        var _index = $("#link4").val();
        var _form = dataFourthSelect[_index][0].link;
        resetForm($(this)[0]);
        $('#myModal').modal('hide');
        openDoc(_form);

    });

    function resetForm(e) {
        $(".error").remove();
        $(".validation-error").removeClass('validation-error');
        e.form.reset();
    }

</script>

1 个答案:

答案 0 :(得分:0)

在检查您给定的代码时,我发现#link4不存在。

因此,行var _index = $("#link4").val();将返回undefined,随后将使下面的代码行失败

var _form = dataFourthSelect[_index][0].link;

希望这会有所帮助。