jQuery使用两个ajax调用检索文本而不是选择列表的值

时间:2015-09-13 08:06:57

标签: jquery ajax

我正在制作state_city_pincode下拉列表。 在第一个ajax调用它工作正常,但当我想要 c_id 值时,它返回文本。

这是我的jQuery / ajax代码:

$('select[name=s_name]').change(function(e){
        e.preventDefault();

        $.ajax({
            url : "{% url 'ajax_city' %}",
            type : "POST",
            data:{
                csrfmiddlewaretoken: '{{ csrf_token }}',
                s_id : $('#s_id').val(),
            },

            dataType: 'json',

            success : function(data) {

                console.log("success");

                $('select[name=c_name]').text('');
                $.each(data, function(key, value){
                    console.log(data)
                    $('select[name=c_name]').append('<option>' + value +'</option>');
                });

            },

            error : function(e) {
                alert('Some error occured');

            }

        });
    });


    $('select[name=c_name]').change(function(e){
        e.preventDefault();

        $.ajax({
            url : "{% url 'ajax_pin' %}",
            type : "POST",
            data:{
                csrfmiddlewaretoken: '{{ csrf_token }}',
                c_id : $('#c_id option:selected').val(),
            },

            dataType: 'json',

            success : function(data) {

                console.log("success");

                $('select[name=p_name]').text('');
                $.each(data, function(key, value){
                    console.log(data)
                    $('select[name=p_name]').append('<option>' + value +'</option>');
                });

            },

            error : function(e) {
                alert('Some error occured');

            }

        });
    });

2 个答案:

答案 0 :(得分:1)

我想我知道出了什么问题。

$('select[name=c_name]').append('<option>' + value +'</option>')

您需要添加值

$('select[name=c_name]').append('<option value="value">' + text+'</option>')

这就是为什么它总是返回文本

http://jsfiddle.net/6nk9c466/1/

答案 1 :(得分:0)

1.如果要清空选择列表,请使用$(<selector>).empty() 2.如果option没有value,则会在Jquery中返回text。因此,在附加时使用此.append('<option value="' + value +'">' + text + '</option>'); 3.每当您从服务器更新选项时,清空当前选择列表都是合适的,因为append只是将新选项附加到现有选项,这会创建重复的options