尝试使用select2 ajax创建表单并进行克隆

时间:2018-10-25 19:25:58

标签: jquery clone jquery-select2

我正在尝试使用Select2和本机克隆脚本进行AJAX调用。

我的html表单是

<div data-repeat=".credits-row" data-repeat-decider=".credits-name" class="form-group">
    <h5>Cast</h5>
    <div class="row credits-row">
        <div class="col-md-3">
            <select name="cast_role_id[]" id="cast_role_id" class="form-control">
            <option value="" disabled="">Select Role</option>
            <option value="1">Actor</option><option value="2">Actress</option><option value="3">Special Appearance</option><option value="4">Guest Appearance</option><option value="5">Supporting Actor</option><option value="6">Supporting Actress</option><option value="7">Child Artist</option>                                    </select>
        </div>
        <div class="col-md-3">
            <select id="cast_p_e_id" class="credits-name p_e" name="cast_p_e_id[]" style=" width: 100%"></select>
        </div>
        <div class="col-md-3">
            <input placeholder="Character Name" type="text" name="cast_character_name[]" value="" class="form-control">
        </div>
        <div class="col-md-3">
            <select name="cast_type[]" id="cast_type" class="form-control">
                <option value="screen">screen</option>
                <option value="voice">voice</option>
            </select>
        </div>
    </div>
</div>

我的ajax请求是

$('.p_e').select2({
    placeholder: 'Search Person or Company',
    ajax: {
      url: 'ajaxpro.php',
      dataType: 'json',
      delay: 250,
      data: function (params) {
        return {
          p_e: params.term, // search term
        };
      },
      processResults: function (data) {
            return {
                results: data
            };
        },
      cache: true
    },
    minimumInputLength: 2
});

});

克隆代码为

$(function() {
    return $("[data-repeat]").each(function(t, e) {
        var n, i, r;
        return e = $(e),
        n = e.data("repeat"),
        i = e.data("repeat-decider"),
        r = function() {
            return _.map(e.find(n + " " + i).not(".select2-container"),
                function(t) {
                    return $(t).val().trim()
                })
        },
        e.on("keyup change blur",
            function() {
                var t;
                if (_.last(r())) return t = $(n, e).first().clone(),
                    t.find("input, textarea, select").each(function(t, e) {
                        return $(e).val("")
                    }),
                e.append(t.hide()),
                t.slideDown(),
                $(document).trigger("cloned", t)
            }),
            e.on("blur change", "input, select, textarea",
                function() {
                    return _.each(_.initial(r()),
                        function(t, i) {
                            var r;
                            if (!t.trim()) return r = $($(n, e)[i]),
                                r.slideUp(function() {
                                    return r.remove()
                                })
                        })
                })
    })
})

row is cloning but select2 value is not removed and not showing ajax search as shown in image

像ajax请求一样显示选择选项未触发

我需要删除克隆行的select2值。

0 个答案:

没有答案