Jquery Ajax Code to populate DropDown Dynamically and resting select

I want to populate Drop Down Dynamically Using json. I need Suggestion of populating dynamically. Is it good way to use on Click? As i have Large Number of records

function getKitNames(id)

    kitName=new Array();

    $.post("/EBioData/AddRowDetailsServlet", {
    }, function(data) {
        var json = eval('(' + data +')')

        for(var i=0;i<json.length;i++){

            $("#kitName"+id).append('<option value='
                +json[i]['kitName']+' >'+json[i]['kitName']


Here is my select in Javascript ccode which is added dynamically kitRowCount=1

<select id="kitName1" name="kitName" 
      onChange="return getKitMake(this.value,1);"  onclick=getKitName(1)>
    <option value=select >select</option>


IMO, you should populate as soon as the page has loaded and while it's not yet populated replace the content with a loading element. You also should use JSON.parse instead of eval.

If you do it on click you have to ensure it's only loaded once (same with in page navigation, if you have a lot of element considere caching). Maybe you need dynamic refresh on each click?

Need Your Help

Sitecore ECM on CD is unable to find a campaign by ID (different core databases)

sitecore sitecore-ecm

I am getting the following exception when clicking on an ECM email link that points to content delivery server,

WPF: Disable arrow-keys on tabcontrol

wpf xaml tabcontrol

I'm using the WPF TabControl in my application in order to switch between different areas/functions of the program.