在函数中执行jquery ajax调用的问题?

时间:2017-02-07 08:56:10

标签: javascript php jquery ajax

我有以下Jquery Cange Event代码

$("input[name=evnt_typ]").change(function(){
    var request = $.ajax({
                            method: "POST",
                            url: "ajaxRequest.php",
                            dataType: "json",
                            data: {fn: 'getCompanyMaster'},
                        });

                        request.done(function (reqResult){

                            $('.dynmic_cotnt').html('');
                            $('.panel-footer').hide();

                            var append_string = '<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">'+
                            '<div class="row form-group">'+
                                '<label class="control-label col-lg-3">Select'+ ' Company</label><span class="col-lg-1 hidden-xs">:</span>'+
                                '<div class="col-lg-8">'+ 
                                    '<select class="chosen" name="company_master" style="width:400px;" onChange="getCompanyEvent(this)">'+
                                        '<option>Select</option>';
                                    $.each(reqResult.result, function(ind, va){
                                        append_string += '<option value='+va.refid+'>'+va.company_name+' ('+va.industry+')</option>';
                                    });
                                    append_string +=  '</select>'+
                                '</div>'+
                            '</div>'+ 
                            '</div>';
                            //alert(append_string);
                            $('#dynmic_slct').html(append_string); 
                            jQuery(".chosen").chosen();
                        });
                        request.fail(function( jqXHR, textStatus){
                            alert( "Request failed: " + textStatus );
                        });
});

在上面代码中我必须创建动态选择元素并在更改事件中调用getCompanyEvent() ..

function getCompanyEvent(element){

            var selected_cid = element.value;

                alert(selected_cid);

                var request = $.ajax({
                    method: "POST",
                    url: "ajaxRequest.php",
                    dataType: "json",
                    data: {fn: 'getCompanyEvent', company_id: selected_cid},
                    success: function(reqResult){
                        var append_string = '<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">'+
                                '<div class="row form-group">'+
                                    '<label class="control-label col-lg-3">Select'+ ' Event</label><span class="col-lg-1">:</span>'+
                                    '<div class="col-lg-8">'+ 
                                        '<select class="chosen" style="width:200px;" onChange="getTemp(this)>'+
                                          '<option>Select</option>';
                                        $.each(reqResult.result, function(ind, va){
                                            append_string += '<option value='+va.event_id+'>'+va.event_name+'</option>';
                                        });    
                    append_string += '</select>'+
                                    '</div>'+
                                '</div>'+ 
                            '</div>';
                        $('#dynmic_slct').append(append_string);
                        jQuery(".chosen").chosen();
                    }
                }); 
        } 

上面的函数和Change事件我写了相同的文档(index.php).. acutully上面的fn生成动态选择元素与标签选择事件但我得到标签只看到结果enter image description here

我还检查了我的php逻辑,每件事情都很好,返回结果集..

1 个答案:

答案 0 :(得分:1)

这是一个非常愚蠢的错误,很难调试。

如果您在此行中看到您的代码

'<select class="chosen" style="width:200px;" onChange="getTemp(this)>'+

需要这个

'<select class="chosen" style="width:200px;" onChange="getTemp(this)">'+

"

之后添加了getTemp(this)

var reqResult = {};
reqResult.result = [{
  event_id: '1',
  event_name: 'er'
}, {
  event_id: '2',
  event_name: 'erewr ewrewr'
}, {
  event_id: '3',
  event_name: 'erewr'
}, ]

var success = function(reqResult) {
  var append_string = '<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">' +
    '<div class="row form-group">' +
    '<label class="control-label col-lg-3">Select' + ' Event</label><span class="col-lg-1">:</span>' +
    '<div class="col-lg-8">' +
    '<select class="chosen" style="width:200px;" onChange="getTemp(this)>"' +
    '<option>Select</option>';
  $.each(reqResult.result, function(ind, va) {
    append_string += '<option value=' + va.event_id + '>' + va.event_name + '</option>';
  });
  append_string += '</select></div></div></div>' +
    '</div>' +
    '</div>' +
    '</div>';
  $('#dynmic_slct').append(append_string);
}
success(reqResult)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dynmic_slct"></div>