What error is there in the jQuery

Question

Below in the code the vanilla javascript version works fine but the jQuery one I tried to code does not produce the update to the input's text. What error is there in the jQuery one as I cannot seem to spot it.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title> Total Tutor </title>
  <link type="text/css" rel="stylesheet" href="query.css">
  <script src="../jquery.js"></script>
</head>

<body>
  <div id="main">
    <button class="fileUpload">
<input id="uploadBtn" type="file" class="upload">
</button>
    <input id="uploadFile" placeholder="0 files selected" disabled="disabled">

  </div>
</body>
</html>

<script>
  $("#uploadBtn").change(function() {

    var value = $(this).val();
    $("#uploadFile").val(value);

  });


  //this works fine 

  // document.getElementById("uploadBtn").onchange = function () {
  //     document.getElementById("uploadFile").value = this.value;
  // };
</script>

Works fine. Can you please tell us what error are you getting? — Rajesh, Jun 08 '17 at 08:15
This only works for me in the jsFIddle if I separate button and fileinput: `` — Adder, Jun 08 '17 at 08:20

score 1 · Accepted Answer · answered Jun 08 '17 at 08:22

1

Please try this :

$(function() {
     $("input:file").change(function (){
       var fileName = $(this).val();
       alert(fileName);
       // do whatever you want to do with file name
     });
 });

answered Jun 08 '17 at 08:22

Gurmeet Singh

774
8
21

What error is there in the jQuery

1 Answers1