Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery change event not working

I have html:

<form id="fileuploadform">
    <input type="file" id="fileupload" name="fileupload" />
</form>

and jquery:

$(':file').change(function(){
    var file = this.files[0];
    ...
});

The problem is: the change function fires only when the file selection is different than the selection made previously. That is of course the meaning of the 'change' event. I want my function to be called with the file dialog closes, no matter what.

I tried using 'select' event -- it never gets called

I also tried:

$(':file').bind('dialogclose', function(event) {
    alert('closed');
});

and:

$(':file').live("dialogclose", function(){
    alert('closed1');
}); 

They didn't work either.

like image 969
Codegiant Avatar asked May 21 '13 15:05

Codegiant


People also ask

Does jQuery Val trigger change event?

When you dynamically set a value in a textfield using jQuery . val(), you have to manually trigger the . change event if you want to add extra code that trigger when the value of the field change.

What does trigger change do in jQuery?

Definition and Usage The change() method triggers the change event, or attaches a function to run when a change event occurs. Note: For select menus, the change event occurs when an option is selected. For text fields or text areas, the change event occurs when the field loses focus, after the content has been changed.

How do I set the value of a element in jQuery?

The val() method returns or sets the value attribute of the selected elements. When used to return value: This method returns the value of the value attribute of the FIRST matched element.

How do I get the select box value?

Answer: Use the jQuery :selected Selector You can use the jQuery :selected selector in combination with the val() method to find the selected option value in a select box or dropdown list.


2 Answers

I have faced the same issues when I used to work with jQuery dynamic appended HTML.

I would suggest you to use the below solution

$(document).on('input','#fileupload', function () {
  console.log('Your Code')
}); 
like image 103
Umashankar Avatar answered Oct 05 '22 19:10

Umashankar


try to use this code.

$('#fileupload').on('change', function () {
    alert('Hi');
    //do your function.
});

this function will call only you select different files otherwise not.

like image 43
SanketS Avatar answered Oct 05 '22 21:10

SanketS