I want to call the ajax function once user clicks on the select control or the select control gets focus to itself from keyboard. HTML code is as follows :
Solution 1:
In your code i haven't seen any options for html select box
And, you have registered a change event on select box which will occur only on selecting the options in select box
Add few options in select box and try to select options which will fire the ajax call
See JS FIDDLE HERE
Solution 2:
I think you should do this instead:
$("#scanner" ).bind ("focus" , function ( ) {
alert ("Hello" );
var mod_url = $('#mod_url' ).val ();
$.ajax ({
url : mod_url,
cache : false ,
dataType : "html" ,
type : "GET" ,
data : {
'request_type' :'ajax' ,
'op' :'get_all_stores'
},
success : function (result, success ) {
alert (result);
$('#scanner' ).html (result);
},
error : function ( ) {
alert ("Error is occured" );
}
});
});
Copy And one suggestion about bind is, you can use .on() method instead if you are using jQuery version 1.7+.
What seems to me you want to generate your #scanner elements options by your ajax call, so the changes are:
remove the async:false because ajax has to be asynchronous. change the dataType to html because it seems that you are returning options from there as $('#scanner').html(result); suggests. Solution 3:
I Think This is what you want
$("#scanner" ).bind ('focus' ,function ( ) {
Myfunction ();
}).change (function ( ) {
Myfunction ()
});
function Myfunction ( )
{
var mod_url = "http://google.com" ;
$.ajax ({
url : mod_url,
cache : false ,
dataType : "json" ,
type : "GET" ,
async : false ,
data : {
'request_type' :'ajax' ,
'op' :'get_all_stores'
},
success : function (result, success ) { alert (result);
$('#scanner' ).html (result);
},
error : function ( ) {
alert ("Error is occured" );
}
});
}
Copy here js fiddle DEMO
Post a Comment for "Why The Ajax Function Is Not Getting Called And Alert Is Not Getting Printed Upon Calling The Function?"