Home/ Questions/Q 8485249
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T20:35:22+00:00

How do I use jQuery.post with a complex dynamically created form? Here is my

  • 0

How do I use jQuery.post with a complex dynamically created form?

Here is my code:

<html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="/media/css/screen.css" />
<script>
var id = 0;

function removeField(fieldId) {
    $('#field_'+fieldId).hide();
}

function addField(fieldType) {
    var html = '<tr id="field_'+id+'"><td><input type="button" value="X" onclick="removeField('+id+')"/></td><td><input type="hidden" name="field_'+id+'_type" value="char"><input name="field_'+id+'_name" type="text" value="" /></td><td>'+fieldType+'</td><td><input type="checkbox"  name="field_'+id+'_unique" /></td>';
    switch (fieldType) {
        case 'char':
            html += '<td> <strong>Max length:</strong> <input name="field_'+id+'_max_length" type="text" value=""/></td>';
            break;
        case 'foreignkey':
            html += '<td> <strong>Related model:</strong> <input name="field_'+id+'_related_model" type="text" value=""/></td>';
            break;
    }
    html += '</tr>';
    $('#fields').append(html);
    id += 1;
    $('#fields').show();
}
</script>
</head>
<body>

<form action="/create_model/" method="post">

<strong>Model name:</strong> <input type="text" name="name" /><br/>
<table id="fields"><th style="width:10px;"></th><th style="width:100px;">Name</th><th style="width:50px;">Type</th><th style="width:25px;">Unique</th><th></th></tr></table>
<strong>Add field:</strong> <input type="button" value="Char" onclick="addField('char');" />
<input type="button" value="ForeignKey" onclick="addField('foreignkey');"/><br/>
<input type="submit" value="Create Model" />
</form>

</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If your form is correctly formatted, you can simply use jQuery’s serialize() function together with the post() function. It will build you a query string of your parameters in the form.

    var content = $("#formElement").serialize();

$.post('server.php',{'data':content},function(response){
  // request success callback
});

    serialize

    The .serialize() method creates a text string in standard URL-encoded notation. It operates on a jQuery object representing a set of form elements.

    • 0