更改时不触发onchange事件

Question

I have this in my html, which works:

           <input id="File1" type="file" runat="server" onchange="fileUpload(value)"  /> 

But for IE8 and below I have a button to create a new input: type=file It is working and uploads the file.

But I need to send the value to a function first.

            newUploadBox.setAttribute("onchange", "fileUpload(value)");

Now when I go into inspect element, everything looks right.

It renders out like the original input.

Unfortunately, it does not go to the function like the first one does.

I fond some post on here: Dynamically added SELECT element does not fire onchange event in Internet Explorer && onchange with alert not working in ie

But none are able to help me.

https://jsfiddle.net/satjzr6z/

Answer 1

Try this code

newUploadBox.onchange = fileUpload.bind(this, value);

function.prototype.bind - creates a bound function that has the same body as the original function

Method description

Answer 2

I added a onClientClick event handler to check the validation for me instead of doing an onchange event listener.

I used the following function:

function FileUploadValidate() {
var input;
var thisId;
var fileInput;

input = document.getElementsByTagName("input");

for(i = 0;i < input.length; i++)
{
    if(input[i].getAttribute("type") === "file"){
        thisId = input[i].getAttribute("id"); 
        fileInput = document.getElementById(thisId);
        fileUpload(fileInput.value, thisId)

    }
}

for(i = 0;i < input.length; i++)
{
    if(input[i].getAttribute("type") === "file"){
        thisId = input[i].getAttribute("id"); 
        if(document.getElementById(thisId).style.backgroundColor === "#ff0000"){
            alert("true")
            document.getElementById("decoyBtn").innerText = "Check"
            return
        }else{
            document.getElementById("decoyBtn").style.display = "none"
            document.getElementById("btnSubmit").style.display = "inline"

        }


    }
  } 
}

This will parse through all my file upload input fields. If one doesnt meet my requirements it will not allow them to upload. It is the best work around I could come up with that would work in IE8.

I also used a decoy button that would basically be my "onClientClick" because I didnt want an accidental upload.

The second for each loop checks the condition of all of them validating and if they do it will take the decoy button off the DOM and bring in the ASP.NET button for upload.