使用javascript创建动态HTML表单

我一直在使用谷歌搜索和谷歌搜索，但完全卡住了这一点。使用javascript创建动态HTML表单

我有一个GET请求来检索一些包含用户列表的JSON。但是，用户列表更改。

我想生成一个简单的HTML表单，其中包含用户的名称，然后是一个输入字段，以便可以给他们一个评级。然后我需要收集评级并以JSON发送POST请求。

什么是最好的方法来解决这个问题？我正在考虑循环浏览用户，只是用文本输入类型显示它们，但是我不知道如何使用表单数据发送POST请求！

任何帮助，将不胜感激

2017-02-26 Coder

你不知道如何收集数据，或如何发送它？ –

POST只是表单的'action'属性。指定您想要发布到的位置，并自动处理它。至于检索信息，您是否可以访问PHP等后端语言？他们会让你的任务变得更容易:)否则，你会在使用AJAX检索信息并在表单建立之后注入它，而不是构建动态注入内容的表单;） –

噢，我忘了提及，不能访问任何后端语言 – Coder

上JSON填充UI基

HTML：

<form id="user_list"> 
    <div> 

    </div> 
    <input type="submit"/> 
</form>

JS：

var obj = { 
    users:[{name:"user 1"},{name:"user 2"}] 
} 

var user_list = $("#user_list>div"); 

obj.users.forEach(function(user,index){ 

    user_list.append("<div>"+ 
        "<h1>" + user.name + "</h1>"+ 
        "<input type='text' id='user_"+ index +"'/>"+ 
        "</div>"); 
});

发送选定的值到服务器。

选项1

如果您在此页全文后回来时，点击提交，你必须改变文本框如下

"<input type='text' name='[user_"+ index +"]'/>"+

在服务器请求对象，你会得到一些关键/值。

选项2

如果刨使AJAX请求，你可以再次循环尽管文本框，并建立你的后端要JSON格式并传递虽然AJAX 。

$("input[type='text']").each(function(input){ 
     $(input).val(); 
    });

来源

2017-02-26 23:33:52 kamprasad

非常感谢您的文章，这正是我所期待的！ – Coder

使用javascript创建动态HTML表单

回答

相关问题