soft genic
soft genic

Reputation: 2056

Jquery hiding is not trigered

Following is my javascript in which I've been trying to show certain div and after the function being performed the div should get hide by itself but i am having this issue that in same function both doesnot work like to show first then after some time interval hide that div but when i put event of show and hiding separately it worked fine. Kindly let me know how can i modify the following code so that after processing the result it should hide that div

 function jq(input)
    {


    if (input == 'abc')
    {
    $("#show").show(1000);

        document.getElementById('sele').options.length = 0;

    $('#sele').append('<option value="test">Testing</option>').updateSelect();

    $("#show").hide(1000);

    }
}

 <div id="show" > <img  src="ajax-loader.gif" width="16" height="16" /> </div>

Upvotes: 0

Views: 61

Answers (2)

thecodeparadox
thecodeparadox

Reputation: 87073

$("#show").show(1000, function() {

    $('#sele').empty(); // instead of: document.getElementById('sele').options.length = 0;

    $('#sele').append('<option value="test">Testing</option>').updateSelect();

    // make a delay using setTimeout()
    setTimeout(function() {

      $("#show").hide(1000);

    }, 500);

});

Full Code

function jq(input) {
    if (input == 'abc') {
        $("#show").show(1000, function() {
            $('#sele').empty();
            $('#sele').append('<option value="test">Testing</option>').updateSelect();
            setTimeout(function() {
                $("#show").hide(1000);
            }, 500);
        });
    }
}

Upvotes: 1

bfavaretto
bfavaretto

Reputation: 71918

I think you are getting an error on the following line (check the console):

document.getElementById('sele').options.length = 0;

length is read-only, that's not the way to empty the select. Since you're using jQuery, you could be doing something like this instead:

$('#sele').empty();

Upvotes: 0

Related Questions