How to display Filename into a readOnly textbox

Question

Here's a little thing i want to achieve. I have an asp.net FileUpload and a textbox. When a user clicks the fileUpload and selects a picture from his/her computer/device, i want the image name to be immediately displayed in a textbox before submitting . Here is what i have tried

 <asp:FileUpload ID="Upload" runat="server" ClientIDMode="Static" /> 
<asp:TextBox ID="txtImage" runat="server" ClientIDMode="Static">

$('#Upload').change(function () {

               var filename = $(this).val();
               var lastIndex = filename.lastIndexOf("\\");
               if (lastIndex > 0) {
                   filename = filename.substring(lastIndex + 1);
               }
               $('txtImage').val(filename);
           });

It still cant get it displayed. wHAT AM I MISING PLEASE

Answer 1

you are missing # in $("txtImage") . This should be like this:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            console.log("ready!");
            $('#Upload').change(function () {

                var filename = $(this).val();
                var lastIndex = filename.lastIndexOf("\\");
                if (lastIndex > 0) {
                    filename = filename.substring(lastIndex + 1);
                }
                $('#txtImage').val(filename);
            });
        });

    </script>

<asp:FileUpload ID="Upload" runat="server" ClientIDMode="Static" /> 
<asp:TextBox ID="txtImage" runat="server" ClientIDMode="Static"></asp:TextBox>

Answer 2

TextBox txtImage没有结束标记。

<asp:TextBox ID="txtImage" runat="server" ClientIDMode="Static"/>