Ajax选择选项不起作用

Question

我正在尝试在选择框中加载公司列表，然后在从列表中选择公司时通过ajax显示该公司的信息（companyInfo）。我可以在下拉框中加载公司，但是每个公司的公司信息都在每个公司中加载而不是ajax加载每个公司。有人可以帮忙吗？

这是表格

<label for="companyName">Company name:</label>
        <input type="text" name="companyName" id="companyName" value="<?php echo $companyName ?>"/>
        <button class="searchBtn">Search</button>

        <hr/>
        <select onchange="getInfo" id="companySelect"></select>

这是JS

LookUpComponent = function ($container) {

var $searchBtn = $container.find('button.searchBtn');

var $companyListContainer = $container.find('#companySelect');

 $searchBtn.bind('click', searchBtnClick);

function searchBtnClick() {


    var companyName = $container.find('input#companyName').val();

    if (companyName === "") {
        alert("Company name should not be empty");
        return;
    }

    $.ajax({
        url: "php/lookup.php",
        dataType: 'JSON',
        type: 'POST',
        data: JSON.stringify({
            "companyName": companyName
        }),
        success: onLookUpSucess,
        error: onLookUpError,
        contentType: 'application/json; charset=utf-8'
    });
}

function onLookUpSucess(response) {
    var companyList = JSON.parse(response);
    $companyListContainer.empty();
    if (companyList.length > 0) {
        for (var i = 0; i < companyList.length; i++) {
            var $companyContainer = getCompanyView(companyList[i]);
            $companyListContainer.append($companyContainer);
            new GDPComponent($companyContainer, companyList[i]);
        }
    }
}

function onLookUpError(response) {

}

function getCompanyView(company) {
    return $('<option class="companySingle" value="' + company.NME + '">' + company.NME +   '</option>');
}
};


GDPComponent = function ($companyContainer, company) {

var $getInfoSelect = $companyContainer.find('option.companySingle');

 $getInfoSelect.bind('click').change, getInfo();

function getInfo() {

    $companyContainer.find('div.companyInfo').remove();

    $.ajax({
        url: "php/gdp.php",
        dataType: 'JSON',
        type: 'POST',
        data: JSON.stringify({
            "dunsNumber": company.DUNS_NBR
        }),
        success: onGetInfoSucess,
        error: onGetInfoError,
        contentType: 'application/json; charset=utf-8'
    });

}

function onGetInfoSucess(response) {
    var companyResponse = JSON.parse(response);
    $companyContainer.append(getCompanyView(companyResponse));
}

function onGetInfoError() {

}

function getCompanyView(companyResponse) {
    return $('' +
        '<div class="companyInfo">' +
            companyResponse.PRIM_NME + "<br/>" + getCompanyDetailsView(companyResponse) +
        '</div>');
}

function getCompanyDetailsView(companyResponse, parent) {

    var parent = parent ? parent + " - " : "";

    var $details = "";

    for(field in companyResponse) {
        if (companyResponse.hasOwnProperty(field)) {
            if (companyResponse[field] instanceof Object) {
                $details += getCompanyDetailsView(companyResponse[field], field);
            } else {
                $details += '<strong>'+ parent + field +':&nbsp;</strong> <input type="text" name="'+ parent + field +'" id="'+ parent + field +'" size="30" value="'+ companyResponse[field] +'"><br/>';
            }
        }

    }

    return $details;
}

};