jQuery:将值设置为选择输入字段

索昆塔内斯·乔伊

我正在使用Django forms. 当用户单击特定的表行时,它将打开一个editModal并获取该表行的值。但是,我无法将该值设置为 type 的输入select

$("#question_type").val("question_type");

上面的代码不起作用。

jQuery

//Edit OnClick- Question
$(".table-row td:not(:has(input))").on("click", function(){
  $('#editModal').modal('show');
  let rowId = $(this).closest('tr').attr('data-id');
  var test_id, question_type, question_name, option;

  $.ajax({
    url: "{% url 'edit_question' %}",
    type: 'GET',
    data: {"rowId" : rowId},
    dataType: 'json',
    success: function(data){
      test_id = data.question[0]['test_name'];
      question_name = data.question[0]['question_name'];
      question_type = data.question[0]['question_type'];
      if (question_type == 'QCM'){
        option = parseInt(data.question[1].length);
      }


      $(".question_name").val(question_name);
      //input of type text works fine.
      $(".question_type").val(question_type);
      $(".test_id").val(test_id);
      },
    });

$(".question_type").val(question_type); $(".test_id").val(test_id); //不将值设置为选择输入

.html

<div class="modal fade" id="editModal" tabindex="-1" role="">
    <div class="modal-dialog modal-login" role="document">
        <div class="modal-content">
            <div class="card card-signup card-plain">
                <div class="modal-body">
                    <form class="form" method="POST" action="{% url 'edit_test' %}">
                        {% csrf_token %}
                        <h2>Edit Question</h2>
                        <div class="card-body">
                            <div class="form-group ">
                                <label>Test :</label>
                                <div class="input-group">
                                    {{questionForm.test_id}}
                                </div>
                            </div>
                            <div class="form-group ">
                                <label>Type :</label>
                                <div class="input-group">
                                    {{questionForm.question_type}}
                                </div>
                            </div>
                            <div class="form-group ">
                                <label>Question :</label>
                                <div class="input-group">
                                    {{questionForm.question_name}}
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

表格.py

class QuestionForm(ModelForm):
        class Meta:
            model = Question
            fields = ['test_id','question_type','question_name']
        test_id = forms.ModelChoiceField(queryset=Test.objects.all(), empty_label=None, label='Test',
                widget=forms.Select(
                    attrs={
                        'id': "test_id",
                        'name': "test_id",
                        'title': 'Select a Test',
                        'class': 'selectpicker form-control test_id',
                        'data-style': 'btn btn-primary btn-sm',
                        'data-size': '7',
                    }
                )
        )
        question_type = forms.ChoiceField(choices = QUESTION_TYPE, initial='QCM',
                widget=forms.Select(
                    attrs={
                        'id': "question_type",
                        'name': "question_type",
                        'title': 'Select a Test',
                        'class': 'selectpicker form-control question_type',
                        'data-style': 'btn btn-primary btn-sm',
                        'data-size': '7',
                    }
                )
        )
        question_name = forms.CharField(label='Question', 
            widget=forms.TextInput(
                attrs={
                    'id': "question_name",
                    'name': "question_name",
                    'class': 'form-control question_name',
                    'placeholder': 'Add question here...',
                }
            )
        )

我已经搜索了很多解决方案,但都没有奏效。导致错误的原因是什么?我怎么能解决这个问题?谢谢你。

索昆塔内斯·乔伊

在尝试了许多解决方案后,我意识到我无法将值设置到输入字段中,因为输入字段是使用引导选择创建的。使用val()设定值不会刷新的UI,所以我不能看到在浏览器上的变化。

解决方案

$(".question_type").selectpicker('val', question_type);

我做了这个改变,现在一切正常!

阅读更多 Bootstrap-select .selectpicker('val')

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

jQuery将值设置为委托输入字段

来自分类Dev

PHP从“组合”框中选择一个项目,然后将值设置为输入字段

来自分类Dev

将变量设置为输入值(jQuery)

来自分类Dev

jQuery如何将值从输入字段设置为其他元素的数据属性

来自分类Dev

将值设置为其他输入字段

来自分类Dev

当“下拉列表选择”字段设置为某个值时,清除文本输入字段吗?

来自分类Dev

无法将值设置为 jquery 的隐藏字段

来自分类Dev

通过 jquery 将输入值设置为 var

来自分类Dev

仅将输入字段设置为空字符串而没有选择标记

来自分类Dev

将一个选择输入的选择值设置为另一个选择选项值

来自分类Dev

如何根据先前的字段值设置选择输入的值

来自分类Dev

将值设置为输入字段时,西班牙语文本无法正确显示

来自分类Dev

将文本框输入值设置为数据库中的字段?

来自分类Dev

将null设置为输入字段的空字符串值

来自分类Dev

在Angular 7中将输入字段的值设置为可能为null

来自分类Dev

Wordpress 将输入字段中的值设置为登录用户的评论作者

来自分类Dev

将值设置为原始类型字段

来自分类Dev

将输入值设置为Javascript变量

来自分类Dev

将输入值设置为空

来自分类Dev

无法将值从 JQuery 日期范围选择器传输到输入字段

来自分类Dev

在 JQuery 中使用 AND 和 OR 选择选择单选按钮组合后,如何为输入字段设置不同的值?

来自分类Dev

使用jQuery将在页面加载时为空的只读输入字段设置为具有特定值

来自分类Dev

jQuery如果输入值为1并且选择了输入

来自分类Dev

在文本输入字段中将值设置为货币

来自分类Dev

将焦点设置为输入字段而光标不闪烁

来自分类Dev

将二维数组设置为输入隐藏字段

来自分类Dev

将焦点设置为输入字段,而不会使光标闪烁

来自分类Dev

如何将变量设置为输入字段的标签?

来自分类Dev

jQuery datepicker输入字段设置为“不可点击”

Related 相关文章

  1. 1

    jQuery将值设置为委托输入字段

  2. 2

    PHP从“组合”框中选择一个项目,然后将值设置为输入字段

  3. 3

    将变量设置为输入值(jQuery)

  4. 4

    jQuery如何将值从输入字段设置为其他元素的数据属性

  5. 5

    将值设置为其他输入字段

  6. 6

    当“下拉列表选择”字段设置为某个值时,清除文本输入字段吗?

  7. 7

    无法将值设置为 jquery 的隐藏字段

  8. 8

    通过 jquery 将输入值设置为 var

  9. 9

    仅将输入字段设置为空字符串而没有选择标记

  10. 10

    将一个选择输入的选择值设置为另一个选择选项值

  11. 11

    如何根据先前的字段值设置选择输入的值

  12. 12

    将值设置为输入字段时,西班牙语文本无法正确显示

  13. 13

    将文本框输入值设置为数据库中的字段?

  14. 14

    将null设置为输入字段的空字符串值

  15. 15

    在Angular 7中将输入字段的值设置为可能为null

  16. 16

    Wordpress 将输入字段中的值设置为登录用户的评论作者

  17. 17

    将值设置为原始类型字段

  18. 18

    将输入值设置为Javascript变量

  19. 19

    将输入值设置为空

  20. 20

    无法将值从 JQuery 日期范围选择器传输到输入字段

  21. 21

    在 JQuery 中使用 AND 和 OR 选择选择单选按钮组合后,如何为输入字段设置不同的值?

  22. 22

    使用jQuery将在页面加载时为空的只读输入字段设置为具有特定值

  23. 23

    jQuery如果输入值为1并且选择了输入

  24. 24

    在文本输入字段中将值设置为货币

  25. 25

    将焦点设置为输入字段而光标不闪烁

  26. 26

    将二维数组设置为输入隐藏字段

  27. 27

    将焦点设置为输入字段,而不会使光标闪烁

  28. 28

    如何将变量设置为输入字段的标签?

  29. 29

    jQuery datepicker输入字段设置为“不可点击”

热门标签

归档