附加html无法正常工作

时间:2014-08-14 07:30:19

标签: jquery

我无法将htmlMon的值附加到我的jsp中id为'monValue'的选择框中。 我在htmlMon中获得了所需的值。

$(document).off('change','input:radio[name="monType"]').on('change','input:radio[name="monType"]',function(){

    var type = $(this).val();

    if (type != "") {
        $.post('/sams/monitor/'+type, {
            type : $(this).val(),
            ajax : 'true'
        }, function(data) {
            var htmlMon = '';
            $('#monValue').html(htmlMon);
            var len = data.length;
            for ( var i = 0; i < len; i++) {
                htmlMon += '<option value="' + data[i].id + '">' + data[i].name + '</option>';                         
            }

            $('#monValue').append(htmlMon);
            $('#monValue').trigger('update-select-list').change();
        },
        'json');
    } else {
        var emptyHtml = '';

        $('#monValue').html(emptyHtml);
        $('#monValue').trigger('update-select-list').change();
   }
 });

这是Html

<p class="inline-label"> <label class="label">Positive/Negative</label> &nbsp;&nbsp;&nbsp; <input id="publishRadio" type="radio" name="monType" value="Positive" checked="checked" /> Positive &nbsp; <input type="radio" name="monType" value="Negative"/> Negative </p> <p class="inline-label"> <input type="hidden" value="" /> <label class="label">Select Monitoring</label> <select style="width: 150px; padding: 5px;" id="monValue"> <c:forEach items="${lookupTypes}"var="ltps"> <option value="${ltps.id}">${ltps.name}</option></c:forEach></select></p>

请帮帮我。

2 个答案:

答案 0 :(得分:0)

似乎option代码没有input type=select代码。

答案 1 :(得分:0)

而不是append()尝试使用html(),因为您已经用empty string替换了现有的选择框选项。我创建了一个带有静态值的fiddle,并且工作正常。

因此,在从ajax请求获取响应后,您的jQuery代码可能是这样的:

        var htmlMon = '';
        $('#monValue').html(htmlMon);
        var len = data.length;
        for ( var i = 0; i < len; i++) {
            htmlMon += '<option value="' + data[i].id + '">' + data[i].name + '</option>';                         
        }

        $('#monValue').html(htmlMon);
        $('#monValue').trigger('update-select-list').change();