当前位置: 首页 > 面试题库 >

jQuery Ajax表单和动态创建的表单元素未提交

聂华翰
2023-03-14
问题内容

我正在写一个表单,其中包含更改选择列表时动态加载的一些文本输入元素。

问题是,当我提交表单时,那些元素不会在发布到服务器的数据中发送。

我需要做什么才能使那些动态创建的元素“进入”要提交的表单?

代码是这样的:

$("#my_select_id").change(function() {
    $.ajax({
        type: "GET",
        url: "some-url/" + $("#played_number_game_id").children("option:selected").val(),
        async: false, 
        dataType: "html",
        error: function(XMLHttpRequest, status, errorThrown) {
            alert("oh no!");
            alert(status);
        },
        success: function (data, status) {
            $("#parent-element").html("");
            $("#parent-element").append(data);
        },
        complete: function() {
        }
    });

    $("#my_form_submit").click(function() {
        $("#my-form").ajaxSubmit({ clearForm: true }); 
        return false;
    });
});

Ajax调用返回的html是:

<input id="my-form_e_1" class="number-input" type="text"/>
<input id="my-form_e_2" class="number-input" type="text"/>

而且,如果我在调用ajax方法后使用firebug来查看页面,则动态加载的html就在应具有的层次结构中,即形式正确。

但是,当我单击“提交”按钮时,只有ajax调用之前存在的表单元素才会发布。

有任何想法吗?


问题答案:

您的问题似乎是动态添加的输入元素没有name属性。name如果希望输入元素的值包含在提交的数据中,则输入元素需要属性。



 类似资料:
  • 问题内容: 使用jQuery 动态创建隐藏的 输入 表单字段的最简单方法是什么? 问题答案: 要回答第二个问题:

  • 问题内容: 我有一个使用ajax动态创建的表单(因为表单元素的数据必须来自数据库),我想序列化表单元素以由ajax提交。我目前正在使用jQuery网站上的代码测试我的理论,以查看是否可以拾取表单元素,这就是问题所在: 我需要在提交之前对数据进行一些更改,并且尚未编写此代码,但是我发现,页面加载时存在的页面上的所有输入元素均被正确拾取,可以正确拾取使用Javascript填充的内容,但是将忽略使用A

  • pre { white-space: pre-wrap; } 本教程向您展示如何通过 easyui 提交一个表单(Form)。我们创建一个带有 name、email 和 phone 字段的表单。通过使用 easyui 表单(form)插件来改变表单(form)为 ajax 表单(form)。表单(form)提交所有字段到后台服务器,服务器处理和发送一些数据返回到前端页面。我们接收返回数据,并将它显

  • 本文向大家介绍js创建表单元素并使用submit进行提交,包括了js创建表单元素并使用submit进行提交的使用技巧和注意事项,需要的朋友参考一下 js 创建form、input元素,并设置form的action及method,最后使用submit进行提交

  • 但是,如果我这样做,'Required'验证器在单击Submit按钮时不起作用。 我试过几种方法: > 没有设置[ngModelOptions]=“{standalone:true}”,而是尝试了name='person:{{$index}}‘。不起作用。

  • 主要内容:HTML5 新的表单元素,HTML5 <datalist> 元素,实例,HTML5 <keygen> 元素,实例,HTML5 <output> 元素,实例,HTML5 新表单元素HTML5 新的表单元素 HTML5 有以下新的表单元素: <datalist> <keygen> <output> 注意:不是所有的浏览器都支持HTML5 新的表单元素,但是你可以在使用它们,即使浏览器不支持表单属性,仍然可以显示为常规的表单元素。 HTML5 <datalist> 元素 <datalist>