【问题标题】:Datepicker enable after select symbol选择符号后启用日期选择器
【发布时间】:2018-06-19 10:02:29
【问题描述】:

我有 2 个字段,符号和日期,如果启用日期选择器后选择符号,则禁用日期选择器。

<script src="{{asset('js/libs/jquery.js')}}" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css">
<link href="{{asset('css/bootstrap-datetimepicker.min.css')}}" rel="stylesheet" media="screen">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>




<div class="form-group col-sm-10">
                {!! Form::label('symbol', 'Symbals:') !!}
                {!! Form::select('symbol_id', [''=>'Choose market']  , null, ['class'=>'form-control', 'id'=>'symbol'])!!}
            </div>
<div class="form-group col-lg-5">
                {!! Form::label('tradedate', 'Traded date:') !!}
                <div class=" input-append date form_datetime" data-date="{{date('Y-m-d H:i:s')}}" data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">
                    <input size="16" type="text" value="" readonly class="form-control">
                    <span class="add-on"><i class="icon-remove"></i></span>
                    <span class="add-on"><i class="icon-th"></i></span>
                </div>
                <input type="hidden" id="dtp_input1" value="" name="tradedate" />
            </div>

此脚本使用 datepicker,我以日期、时间和选择月份的形式使用,datepicker javascript 可用如下: 这个javascript使用timepicker,

<script type="text/javascript">
    $('.form_datetime').datetimepicker({
        //language:  'fr',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1
    });
    $('.form_date').datetimepicker({
        language:  'fr',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,
        forceParse: 0
    });
    $('.form_time').datetimepicker({
        language:  'fr',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 1,
        minView: 0,
        maxView: 1,
        forceParse: 0
    });
</script>

【问题讨论】:

  • 您的问题不清楚?
  • 我有一个表格分为 2 个字段,当符号不选择值然后不选择日期,选择符号值日期字段(日历)后启用或显示 -@HarishSoni

标签: javascript jquery ajax datepicker jquery-ui-datepicker


【解决方案1】:
// use jquery
// event is fired when select change
$('#symbol').on('change', function() {
    // this.value - to retrieve the value of selected option

    // do whatever you want. Give 'id' to your datepicker and you can use 'addClass' to disable datepicker depends on plugin you use

    // for example
    if (this.value == 0) {
        $('#datepicker').attr('disabled',true);
    } else {
        $('#datepicker').attr('disabled',false);
    }
});

更新

在这里,我为您创建了 jsfiddle。看它。我想你想要这样的东西。 jsfiddle

【讨论】:

  • 解释为什么-1?
  • 它的代码对我不起作用-@Begmuhammet Kakabayev
  • 这不仅仅是复制和粘贴。它行不通。根据您的问题(不清楚)给您复制粘贴代码是不可能的。我只是给你提示如何做到这一点。只是谷歌它。 @KinnariPrajapati
  • 是的,我在需要时更改代码,但它不起作用 -@Begmuhammet Kakabayev
  • 你用什么日期选择器插件?
猜你喜欢
  • 2014-11-10
  • 2018-07-27
  • 1970-01-01
  • 2020-11-17
  • 2023-03-02
  • 1970-01-01
  • 2019-03-15
  • 2019-09-28
  • 2023-03-20
相关资源
最近更新 更多