1

我想将 Date 的值保持为我指定的默认值。如果用户单击提交按钮时未选择日期。

我需要的功能是什么。如果用户选择一个日期并提交表单，则提交后表单选择的日期值必须是日期字段上的值，这样可以完美地工作。我有问题，即。当未选择日期且用户提交表单时，日期字段默认为今天的日期选择日期

我的代码如下

HTML

<body  onload="CovertDateToString()">

    <form action="searchDate" method="post" id="searchDate" class="searchDate"  modelAttribute="searchDate">
        <!-- Select type selectDateRange-->
            <div class="form-group ">
                        <div class="col-md-3 selectContainer">
                            <div class="input-group">
                                <input type="text" class="form-control" name="selectDateRange" id="selectDateRange" value="${newDate}">
                                <span class="input-group-addon"><i  class="glyphicon glyphicon-calendar"></i></span> 
                        </div>
                </div>
            </div>
          <!-- Select type search button with input-->
        <div class="form-group">
            <div class="col-md-3 inputGroupContainer">
                <div class="input-group">
                    <span   class="input-group-btn">
                     <button class="btn btn-success"  type="submit">
                        <div class="up" style="margin-top: -8%; color: white;">Search</div></button>
                     </span>
                   </div>
                 <!-- /input-group -->
            </div>
        </div>
    </form>
</body>

js代码

function CovertDateToString() { 

    var date = <%=request.getParameter("selectDateRange")%>;    
    var myDate = new Date();
    var selectDate = myDate.toDateString();
    var selectDate = "Select Date"; 
    document.getElementsByName('selectDateRange')[0].value = selectDate;
    selectDate = date;
    document.getElementsById('selectDateRange')[0].value = date;
    console.log("Set Date to Select Date ",selectDate);
    console.log("Set Date to Selected Date ",date);
}

日期范围选择器

$(function() {      
    $('input[name="selectDateRange"]').daterangepicker({              
        locale: {
             format: 'YYYY-MM-DD'
        }
    });
});
4

2 回答 2

1 
        function CovertDateToString() { 

            var date = "${newDate}";    
            var myDate = new Date();
            var selectDate = myDate.toDateString();
            document.getElementsByName('selectDateRange')[0].value = selectDate;
            selectDate = date;
            document.getElementById('selectDateRange').value = date;
            console.log("Set Date to Select Date ",selectedDate);
            console.log("Set Date to Selected Date ",date);

        }    

       $(function() {      
        $('input[name="selectDateRange"]').daterangepicker({              
          locale: {
             format: 'YYYY-MM-DD'
            }
          });
       });

在这个问题上花了更多时间后，我终于让它工作了。删除 request.getParamter 是删除后的平均原因日期

于 2017-10-30T22:43:21.377 回答
-1

请检查以下代码，我在动态值的位置使用了静态值，因此请对其进行管理，并且代码在 snnipet 上运行良好。

  

 function CovertDateToString() { 
    var date = "${newDate}";
	
    var arr = date.split(" ");
    if(arr != "null"){
    	$("#selectDateRange").data('daterangepicker').setStartDate(arr[0]);
    	$("#selectDateRange").data('daterangepicker').setEndDate(arr[2]);
    }
}
    $(function() {      
        $('input[name="selectDateRange"]').daterangepicker({              
            locale: {
                 format: 'YYYY-MM-DD'
            }
        });
    });     
    <script src="https://cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <script src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="https://cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" rel="stylesheet"/>
    <body  onload="CovertDateToString()">

        <form action="searchDate" method="post" id="searchDate" class="searchDate"  modelAttribute="searchDate">
            <!-- Select type selectDateRange-->
                <div class="form-group ">
                            <div class="col-md-3 selectContainer">
                                <div class="input-group">
                                    <input type="text" class="form-control" name="selectDateRange" id="selectDateRange" >
                                    <span class="input-group-addon"><i  class="glyphicon glyphicon-calendar"></i></span> 
                            </div>
                    </div>
                </div>
              <!-- Select type search button with input-->
            <div class="form-group">
                <div class="col-md-3 inputGroupContainer">
                    <div class="input-group">
                        <span   class="input-group-btn">
                         <button class="btn btn-success"  type="submit">
                            <div class="up" style="margin-top: -8%; color: white;">Search</div></button>
                         </span>
                       </div>
                     <!-- /input-group -->
                </div>
            </div>
        </form>
    </body>

于 2017-10-30T11:19:28.317 回答