Skip to content

Instantly share code, notes, and snippets.



Last active Aug 29, 2015
What would you like to do?
d3 build form dynamically
<!doctype html>
<script src=""></script>
<script type="text/javascript">
window.onload = function(){
var schema = {
fields: [
{name: 'first_name', type: 'text', display: 'First Name'},
{name: 'last_name', type: 'text', display: 'Last Name'},
{name: 'country', type: 'dropdown', display: 'Country',
values: ['lebanon', 'france', 'usa']
var form ="body").append("form");
var p = form.selectAll("p")
var self =;
var label = self.append("label")
.style("width", "100px")
.style("display", "inline-block");
if(d.type == 'text'){
var input = self.append("input")
type: function(d){ return d.type; },
name: function(d){ return; }
if(d.type == 'dropdown'){
var select = self.append("select")
.attr("name", "country")
.text(function(d) { return d; });
form.append("button").attr('type', 'submit').text('Save');

This comment has been minimized.

Copy link
Owner Author

@omaraboumrad omaraboumrad commented Feb 21, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment