Hi I need to create a form and add elements to it programatically.
$form = $("<form></form>");
$form.append("<input type=button value=button");
this doesn't seem to work right.
-
4of course it doesn't. You didn't add a valid element in the second line.Gabi Purcaru– Gabi Purcaru2010-12-21 07:41:43 +00:00Commented Dec 21, 2010 at 7:41
-
What happens instead? What have you tried to resolve the problem?Nico Haase– Nico Haase2023-10-15 12:21:01 +00:00Commented Oct 15, 2023 at 12:21
Add a comment
|
6 Answers
You need to append form itself to body too:
$form = $("<form></form>");
$form.append('<input type="button" value="button">');
$('body').append($form);
Comments
The 2nd line should be written as:
$form.append('<input type="button" value="button">');
3 Comments
Basic
No it shouldn't... Use quotes properly!
.append('<input type="button" value="button" />');
J. Minjire
Confirmed, the suggestion below should be added to this answer. If you don't append thew form to the body it won't submit on Firefox v40.0.3.
Sebas
I removed the closing slash.
input elements don't admit content.var form = $("<form/>",
{ action:'/myaction' }
);
form.append(
$("<input>",
{ type:'text',
placeholder:'Keywords',
name:'keyword',
style:'width:65%' }
)
);
form.append(
$("<input>",
{ type:'submit',
value:'Search',
style:'width:30%' }
)
);
$("#someDivId").append(form);
2 Comments
Decebal
this looks like javascript, the best way to do it, however should be using html markup and after that javascript
Jesse Chisholm
@decebal -
this looks like javascript -- The jQuery library on top of JavaScript. And it is building html markup, then injecting it into the html document on the fly. And that is the point of the OP - to do as much as possible in jQuery.function setValToAssessment(id)
{
$.getJSON("<?= URL.$param->module."/".$param->controller?>/setvalue",{id: id}, function(response)
{
var form = $('<form></form>').attr("id",'hiddenForm' ).attr("name", 'hiddenForm');
$.each(response,function(key,value){
$("<input type='text' value='"+value+"' >")
.attr("id", key)
.attr("name", key)
.appendTo("form");
});
$('#hiddenForm').appendTo('body').submit();
// window.location.href = "<?=URL.$param->module?>/assessment";
});
}
1 Comment
Srihari Goud
Need to remove double quotes from
.appendTo("form");. it should be appendTo(form); The tag is not closed:
$form.append("<input type=button value=button");
Should be:
$form.append('<input type="button" value="button">');
Comments
Using Jquery
Rather than creating temp variables it can be written in a continuous flow pattern as follows:
$('<form/>', { action: url, method: 'POST' }).append(
$('<input>', {type: 'hidden', id: 'id_field_1', name: 'name_field_1', value: val_field_1}),
$('<input>', {type: 'hidden', id: 'id_field_2', name: 'name_field_2', value: val_field_2}),
).appendTo('body').submit();
4 Comments
Jairus
There are many duplicates of this question, but this question appears to be the most relevant for this answer. So I will not repost it in the other similar question.
Cyntech
This is the best option IMHO however, you need to create the form with $('<form/>', ...).
Jairus
Thanks, not really sure how one would go about this without the $('<form/>, and the other options seemed to require more syntax.
Cyntech
the answer originally had $('</form>', ....) which doesn't work and so I edited your answer to correct it (I should have stated this).