slideDown incoming data in jquery AJAX

Question

I am new into jQuery AJAX, so I apologize if the question is too obvious.

I have 2 webforms in ASP.NET, one is to add data into database, the other is to show data in ul-li format.

So far I have succeed only the basic jQuery AJAX, whenever there is a new data, it is shown.

I want that whenever new data is added, it must be shown to the user as slideDown format.

Note: I don't have any answer. The answer below did not help.

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $.ajax({
                url: 'WebForm1.aspx',
                success: function (data) {
                    $("#Urunler").html("<li>" + data + "</li>");
                }
            });
        });
    </script>
    <style>
        td
        {
            width: 200px;
            height: 30px;
            background: yellow;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>


        <ul id="Urunler" runat="server">

        </ul>


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

Thank you very much.

Answer 1

You can do:

$("#Urunler").hide().html("<li>" + data + "</li>").slideDown();

Since your AJAX is on page-load, you can start with the UL hidden via CSS and remove that .hide() , either way.

slideDown incoming data in jquery AJAX

Question

1 answers

solution1
3 ACCPTED 2013-10-28 15:04:13

slideDown incoming data in jquery AJAX

Question

1 answers

solution1 3 ACCPTED 2013-10-28 15:04:13

solution1
3 ACCPTED 2013-10-28 15:04:13