Set CSS for input element of type file via JavaScript

Question

I have some code to set CSS of a input type of file. I create the box dynamically using JavaScript function like this:

/*
    var newLabel = document.createElement('label');
    newLabel.htmlFor='${id}File';
    newLabel.className='upload-file-input';
    ${id}_control_group.append(newLabel);  
*/      
    var newInput = document.createElement('input');
    newInput.type = 'file';
    newInput.name = 'myFile';
    newInput.id = 'myFile'; 
    newInput.accept="image/png, image/jpeg, image/gif";
    newInput.className='upload-file-input'; //this is not working.
    form_control_group.append(newInput);

This CSS is present in class no problem about that.

What is working?

tadman
– tadman

2020-10-20 19:36:00 +00:00
Commented Oct 20, 2020 at 19:36 — tadman
– tadman, Commented Oct 20, 2020 at 19:36

Josh Bonnick · Accepted Answer · 2020-10-20 19:43:46Z

2

newInput.classList.add('upload-file-input')

https://developer.mozilla.org/en-US/docs/Web/API/Element/classList

The classList API is a dream.

answered Oct 20, 2020 at 19:43

Josh Bonnick

2,9032 gold badges14 silver badges22 bronze badges

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

Comments

David · Accepted Answer · 2020-10-20 19:41:38Z

1

newInput.setAttribute("class", 'upload-file-input')

https://www.w3schools.com/jsref/met_element_setattribute.asp

When to use setAttribute vs .attribute= in JavaScript?

answered Oct 20, 2020 at 19:41

David

3264 silver badges14 bronze badges

Collectives™ on Stack Overflow

Set CSS for input element of type file via JavaScript

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related