sujit
sujit

Reputation: 3

jQuery keyup on multiple textboxes won't work with IE11

I have multiple textbox and calling jquery keyup on each text box its working fine on the mozilla firefox and chrome.In internet explorer

Its working fine for the first text box its working perfectly as it should be but other textbox are not working properly ,i mean for them keyup are not calling. .Below are my code:-

I have multiple textbox and calling jquery keyup on each text box its working fine on the mozilla firefox and chrome.In internet explorer

Its working fine for the first text box its working perfectly as it should be but other textbox are not working properly ,i mean for them keyup are not calling. .Below are my code:-

    <script type="text/javascript">
    $(function(){
    $(".search").keyup(function() 
    { 

    var searchid = $(this).val();
    var idloc=document.getElementById("state").value;

    var type='p_school';
    var dataString = 'locality='+ searchid+'&id='+ idloc+'&type='+ type;

    if(searchid!='')
    {
        $.ajax({
        type: "POST",
        url: "loaddata.php",
        data: dataString,
        cache: false,
        success: function(html)
        {
        $("#result").html(html).show();
        }
        });
    }return false;    
    });

    jQuery("#result").on("click", ".show", function() {
        var $name = $(this).find(".name").text();
        var $id = $(this).find(".pid").text();
        var type='state';
        var pid='pid='+$id+'&type='+ type;
        $.ajax({
        type: "POST",
        url: "load_state.php",
        data: pid,
        cache: false,
        success: function(html)
        {
        //alert (html);
        $('#p_school').show();
        $('#p_school').html(html);
        $('#p_school_old').hide();
        }
        });
        $("#searchid").val($name);
        }); 

        jQuery(document).on("click", function(e) { 
        var $clicked = $(e.target);
        if (! $clicked.hasClass("search")){
        jQuery("#result").fadeOut(); 
        }
    });


    if(searchid=='')
    {
    $('#searchid').click(function(){
        jQuery("#result").fadeIn();
    }); }
    });

    $(function(){
    $(".search1").keyup(function() 
    { 
    alert ("hello second textbox");
    var searchid1 = $(this).val();
    var idloc1=document.getElementById("state1").value;
    var type1='s_school';
    var dataString1 = 'locality1='+ searchid1+'&id1='+ idloc1+'&type1='+ type1;


    if(searchid1!='')
    { 
        $.ajax({
        type: "POST",
        url: "loaddata.php",
        data: dataString1,
        cache: false,
        success: function(html)
        {
        $("#result1").html(html).show();
        }
        });
    }return false;    
    });

    jQuery("#result1").on("click", ".show1", function() { 
        var $name = $(this).find(".name1").text();
        var $id = $(this).find(".sid").text();
        //var pid='pid='+ $id.+'&type='+ type;
        var type='s_state'; 
        var pid='pid='+$id+'&type='+ type;
        $.ajax({
        type: "POST",
        url: "load_state.php",
        data: pid,
        cache: false,
        success: function(html)
        {
        //alert (html);
        $('#s_school').show();
        $('#s_school').html(html);
        $('#s_school_old').hide();
        }
        }); 

        $("#searchid1").val($name);
        //alert ("Danstring");

        });

        jQuery(document).on("click", function(e) { 
        var $clicked = $(e.target);
        if (! $clicked.hasClass("search_ss")){
        jQuery("#result1").fadeOut(); 
        }
    });

    if(searchid1=='')

    {
    $('#searchid1').click(function(){
        jQuery("#result1").fadeIn();
    });  }
    });


    </script>

//HTML Code

     HTML are below:-

    <input type="text" placeholder="Primary School" name="primary[]" autocomplete="off" class="search" id="searchid" style="margin-top: 7px; border: 1px solid #7B9E94; min-height: 29px;">

    <input type="text" placeholder="Secondary School" name="secondary[]" autocomplete="off" class="search1"  id="searchid1"  style="margin-top: 7px; border: 1px solid #7B9E94; min-height: 29px;">


    Thanks

Upvotes: 0

Views: 1298

Answers (1)

Roni Tovi
Roni Tovi

Reputation: 886

Since your input elements have different class names, try changing this line:

$(".search").keyup(function()

to this:

$(".search, .search_ss").keyup(function()

Upvotes: 1

Related Questions