Problem with Jquery

Question

I am dynamically creating HTML items using jQuery. Though items are dynamically created but their attributes are note. I mean if I assign class and id in the $() call, the elements are created without those attributes. Even my browser is showing null attributes. Problem is recognized when I tried to populate drop down according to first drop down selection.

for (var i = 1; i <= prescriptionnum; ++i) {
    $("<select/>", {
        class: 'selectdoctor',
        name: 'selectdoctor' + i,
        id: 'selectdoctor' + i
    }).appendTo("#prescriptiondiv").after("<br/>");

    $("<input/>", {
        type: "text",
        class: "textinput",
        name: "textinput" + i,
        id: "textinput" + i
    }).appendTo("#prescriptiondiv").after("<br/><input type='file' id='imageinput'"+ i +" class='imageinput' /><br/><br/>");
}

If same drop-down is created with class selectdoctor using HTML its working and the browser also show attributes but not for the ones that jQuery creates.

@Tieson: jQuery should treat <select/> the same as <select>. — mu is too short
– mu is too short, Commented Sep 13, 2011 at 6:06

mu is too short · Accepted Answer · 2011-09-13 07:50:00Z

1

The <select>s seem to be coming out fine but you have a quoting problem with your <input type="file"> elements, you should be using this:

"<br/><input type='file' id='imageinput" + i + "' class='imageinput' /><br/><br/>"

instead of this:

"<br/><input type='file' id='imageinput'"+ i +" class='imageinput' /><br/><br/>"

Demo: http://jsfiddle.net/ambiguous/nUmNe/1/

As far as not getting any attributes goes, I would guess that you're using an older version of jQuery, something older than 1.4 most like. Consider this version of the fiddle that uses jQuery 1.3.2:

http://jsfiddle.net/ambiguous/JbEMW/

That seems to be matching exactly what you're seeing. Also, from the fine manual:

jQuery( html, props ) version added: 1.4
html A string defining a single, standalone, HTML element (e.g. or ).
props An map of attributes, events, and methods to call on the newly-created element.

So the format of the $() call that you're using wasn't added until version 1.4.

edited Sep 13, 2011 at 7:50

answered Sep 13, 2011 at 6:04

mu is too short

436k71 gold badges863 silver badges822 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Rahul Singh Over a year ago

Yaa got the point.... Let me know reason Y I can't create input type as file using same approach. Thought its working in jsfiddle but showing as text in my browser. I had this my previous question. stackoverflow.com/questions/7385733/…

Rahul Singh Over a year ago

In this I have to create fields using html or after. Fields created using jquery are showing null values. Its working in jsfiddle but not in browser.

mu is too short Over a year ago

@Rahul: Are you having trouble with all the form elements or just the <input type="file"> ones?

Rahul Singh Over a year ago

I have same trouble with all elements as this method don't show attributes in form. I don't know how its working in jsfiddle and showing attributes their. Regarding input type file I can't create field using this method. I have put link for that doubt.

mu is too short Over a year ago

@Rahul: I don't know what you're doing different than the jsfiddle I'm as lost as you are.

|

Collectives™ on Stack Overflow

Problem with Jquery

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related