首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >从select2 2中使用值:开始调用作为ajax自动完成数据参数的输入

从select2 2中使用值:开始调用作为ajax自动完成数据参数的输入
EN

Stack Overflow用户
提问于 2016-06-16 22:13:00
回答 1查看 875关注 0票数 0

我动态地生成一个结果表,每行有一个单元格包含一个自动完成。我使用Select2来显示自动完成选项,并填充从ajax数据和针对每一行的自定义数据中的下拉列表。我的ajax数据来自我的Python应用程序方法,我使用POST将一个变量发送回Python方法,用于生成自定义数据。这是如何设置的:

代码语言:javascript
复制
$(".js-example-tokenizer-ajax-data").select2({
            tags: true,
            createTag: function (params) {
                return {
                  id: params.term,
                  text: params.term,
                  newOption: true
                }
            },
            templateResult: function (data) {
                var $result = $("<span></span>");
                $result.text(data.text);
                if (data.newOption) {
                    $result.append(" <em>(new)</em>");
                }
                return $result;
            },
            placeholder: 'Select an option',
            maximumSelectionLength: 3,
            ajax: {
                url: '{{ url_for("select2Autocomplete") }}',
                contentType: 'application/json',
                method: "POST",
                dataType : 'json',
                data: JSON.stringify({variable:myValue}),
                processResults: function (data) {
                    return {
                        results: data.resource_list
                    };
                }
            }
        });

我已经将select元素的id设置为Jinja模板中的一个值。

代码语言:javascript
复制
<select onfocus="this.selectedIndex = -1;" id="{{ key }}" class="js-example-tokenizer-ajax-data" multiple="multiple" miriamId="{{ value }}" style="width:100%">
    <option value="{{ key }}" selected>{{ miriam_name_dict[value] }}</option>
</select>

因为它是动态的,所以我不知道每个选择的id是什么。我能得到这样的价值:

代码语言:javascript
复制
$('.js-example-tokenizer-ajax-data').on('select2:opening', function (evt) {
            myValue = document.getElementById(this.id).getAttribute('id');
            console.log("myValue: ", myValue)
    });

我希望使用myValue作为通过数据变量发送回python方法的变量。在自动完成代码中是否有访问myValue的方法?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-06-17 17:25:55

我能够将数据传回给用户单击的select元素的自动完成方法,如下所示:

代码语言:javascript
复制
$(".js-example-tokenizer-ajax-data").select2({
            tags: true, //Allows for free text input of tag values
            createTag: function (params) {
                return {
                  id: params.term,
                  text: params.term,
                  newOption: true
                }
            },
            templateResult: function (data) {
                var $result = $("<span></span>");
                $result.text(data.text);
                if (data.newOption) {
                    $result.append(" <em>(new)</em>");
                }
                return $result;
            },
            placeholder: 'Select an option',
            maximumSelectionLength: 3,
            ajax: {
                url: '{{ url_for("select2Autocomplete") }}',
                contentType: 'application/json',
                method: "POST",
                dataType : 'json',
                data: function() {
                    var myValue = $(this).attr('id');
                    return JSON.stringify({variable: myValue})
                },
                processResults: function (data) {
                    return {
                        results: data.resource_list
                    };
                }
            }
        });

我无法直接使用{variable:$(this).attr('id')}作为数据参数的值,并且确实需要在值上使用JSON.stringify来使用jsonData = request.json["variable"]在python方法中获得值。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37870210

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档