how to clear the textbox value of asyncfileupload ..?

There is one button(MyButton). OnClick of this button a modalpopup(MyPopup) appears with one asyncfileupload ajax control, Ok button and Cancel button.

The browse functionality of the asyncfileupload functionality is working fine, No probl开发者_如何学Pythonem. But after postback, if I click the MyButton again, the popup appearing with the previous path in the asyncfileupload control's textbox.

How to clear it ... !

Thanks in advance.

None of the proposed ways worked for me. The problem is not specific to AsyncFileUpload, but to the input[type=file].

Finally, I found a way that worked for me with javascript:

function uploadComplete(sender, args) {
    jQuery(sender.get_element()).find("input[type='file']")[0].form.reset();
}

Set up attribute of AsyncFileUpload descriptor to OnClientUploadComplete="UploadComplete" and use next JS:

function UploadComplete(sender, arg2) {
  // clear file
  var fileInputElement = sender.get_inputFile();
  fileInputElement.value = "";
}

You can apply any actions/styles to the "fileInputElement" too.

this worked for me if you're attempting to clear it client side.

<script type = "text/javascript">
function clearContents() {
    var AsyncFileUpload = $get("<%=AsyncFileUpload1.ClientID%>");
    var txts = AsyncFileUpload.getElementsByTagName("input");
    for (var i = 0; i < txts.length; i++) {
        if (txts[i].type == "file") {
            txts[i].value = "";
            txts[i].style.backgroundColor = "transparent";
        }
    }
}

function uploadComplete(sender) {
    clearContents();
}
</script>

To expand ador's answer above:

function uploadComplete(sender, args) {
    var uploadField = $(sender.get_element()).find("input[type='file']");
    uploadField[0].form.reset();
    uploadField.each(function () { $(this).css("background-color", "white"); });
}

Assuming you're using the control from Ajax Control Toolkit you can hook into the OnClientUploadedComplete handle which is called on the client side once the upload is complete. You want to call hide on the modal popup

 var modalPopupBehavior = $find('popupID');
 modalPopupBehavior.hide();

This is a correction for the Jmoon's answer. This is usefull if you want to clear AsyncFileUpload text not after upload complete but after some other user action.

function clearContents() {
    var AsyncFileUpload = $("#<%=AsyncFileUpload1.ClientID%>")[0];
    var txts = AsyncFileUpload.getElementsByTagName("input");
    for (var i = 0; i < txts.length; i++) {
        txts[i].value = "";
        txts[i].style.backgroundColor = "transparent";
    }
}

This will definitely clear the textbox:

var AsyncFileUpload = $get("<%=AsyncFileUpload1.ClientID%>");
    var txts = AsyncFileUpload.getElementsByTagName("input");
    for (var i = 0; i < txts.length; i++) {
        if (txts[i].type == "file") {
            txts[i].style.backgroundColor = "transparent";
            txts[i].form.reset();
        }
    }