如何在bootstrap 4中更改selectmatic选项?

时间:2018-05-05 12:16:52

标签: javascript jquery bootstrap-4

<li class="nav-item">
    <div class="form-group">
        <select class="custom-select custom-select-lg mb-3 text-white" id="materialType" onchange="typeChange('materialType')" style="background-color: transparent;border: none">
          <option value="Material Type">Material Type</option>
          <option value="All">All</option>
          <option value="Mud">Mud</option>
          <option value="Cloth">Cloth</option>
          <option value="Thread">Thread</option>
          <option value="Jute">Jute</option>
          <option value="Cotton">Cotton</option>
          <option value="Can">Can</option>
          <option value="Bamboo">Bamboo</option>
        </select>
    </div>
</li>

当我刷新页面时,typeChange功能中的所选值将返回到第一个选项Material Type。如何在刷新页面后更改此内容?

typeChange函数

function typeChange(type)
    {
        //alert('type change'); 
        var typeValue = document.getElementById(type).value;
        $.ajax({
            url: 'typeChange.php',
            type: 'POST',
            data:
            {
                type: type,
                typeValue: typeValue
            },
            success: function(data)
            {
                alert(data);
                window.location.href = 'test.php?id=2';
                //$(type).select(typeValue);
            },
            error: function(data)
            {
                //alert('signup error');
                console.log(data);
            }            
        });
    }

我想这样做:$(type).setValue(typeValue); 修改1

我试过

window.location.href = 'test.php?id=2';
$(type).val(typeValue);

但似乎没有效果。

修改2

我也试过

window.location.href = 'test.php?id=2';document.getElementById(type).value = typeValue;

但这也不起作用。

编辑3

我还在SESSION中使用了select选项值 $_SESSION['materialType']

编辑4
我的选择选项在导航器中

image.png

2 个答案:

答案 0 :(得分:1)

您的流程思维需要调整。您无法在$.ajax内设置值,因为您正在重新加载页面。当前页面加载的状态均未被浏览器保存以用于下一次加载

这意味着您需要在下一页加载

上设置值

假设主页面是php文件,您需要以下内容:

<?php
   session_start();
   $type = isset($_SESSION['materialType']) ? $_SESSION['materialType'] :'';// default to empty string or whatever value you want
?>

<script>
  $(function(){
    $('#materialType').val('<?php echo $type ?>');
  })
</script>

答案 1 :(得分:0)

只需使用jquery执行此操作:

$('#selectid').val(variable);
$('#selectid').trigger('change');

当然,我放在那里的'变量'是select中的值='',并且必须等于一个选项值。