How to preserve dropdown data after postback

I am binding dropdown at client side using Jquery. I am fetching data from server using PageMethods.

html

<asp:DropDownList ID="ddlCountry" runat="server" ClientIDMode="Static" 
                  onchange="return country_changed();" ViewStateMode="Enabled">
</asp:DropDownList> 

JS

function GetCountryLst() {
    PageMethods.GetCountryList(OnsuccessCountry);
    return false;
}

function OnsuccessCountry(result) {
    $("#ddlCountry").append("<option value='Select'>Select</option>");
    for (var eachval in result) {
         $("#ddlCountry").append("<option value='" + result[eachval].id + "'>" + result[eachval].name + "</option>");
    }
    return false;
}

On button click when i write

protected void Button2_Click(object sender, EventArgs e)
{
    var ddlcount =开发者_如何学Python ddlCountry.Items.Count;
}

I get ddlCount = 0; How can i preserve the data

<input type='hidden' id='items' />

function OnsuccessCountry(result) {
    $("#ddlCountry").append("<option value='Select'>Select</option>");
    for (var eachval in result) {
         $("#ddlCountry").append("<option value='" + result[eachval].id + "'>" + result[eachval].name + "</option>");

    $("#items").val($("#items").val() + ";" + result[eachval].id) ;
    }
    return false;
}

And split (with ; ) the value of this hidden field at server side and get count and all items also..

If you are using Page method to fill data you can't get the dropdown list items count from server side. Because it will be cleared when Page_load event happens.