Dropdown values not added in ajax call back This my html code 

```
<div class="wrap">
    <div id="SeatInfo" class="floatleft"></div>
    <div id="ClusterInfo" class="floatright">
        <label id="Floor">Floor</label>
        <select id="FloorInfo">
            @foreach (SelectListItem item in ViewBag.data)
            {
                <option value=@item.Value>@item.Text</option>
            }
        </select>
        <label id="Seat">Seat</label>
        <select id="SeatInfo">

        </select>

    </div>
    <div style="clear: both;">
    </div>
</div>

```

This is script 

```
<script type="text/javascript">
    $(document).ready(function() {

        $("#FloorInfo").change(function () {
            var value = $(this).val();
            $.ajax({
                url: "/Home/SeatInfo",
                type: "POST",
                contentType: "application/json",
                data: JSON.stringify({ FloorID: parseInt(value) }),
                success: function(data) {
                    $('#SeatInfo').empty(); // clear the current elements in select box
                    var dataDetails = data.split(':');
                    for (var i=0;i<dataDetails.length; i++) {
                        debugger;  var info = dataDetails[i].split(',');
                        $('#SeatInfo').append($('<option></option>').attr('value', info[0]).text(info[1]));
                    }

            }});
        });
    });

</script>

```

callback result data value : "Testing ,2017:sf ,2018:dfsad ,2019:"

Second dropdown values not added after done selection changed ? I able to get proper data in debugging