如何从控制器中的日期选择器中获取选定日期的值？

Question

我有两个日期选择器：

 <div class='input-group date datepicker1'>
       <input  data-format="dd/mm/yyyy" name="startDate" placeholder="DD/MM/YYYY" type='text' class="form-control" required/>
           <span class="input-group-addon">
               <span class="glyphicon glyphicon-calendar"></span>
           </span>
 </div>

<div class='input-group date datepicker2'>
        <input  data-format="dd/mm/yyyy" name="endDate" placeholder="DD/MM/YYYY" type='text' class="form-control" required/>
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
 </div>

我需要获取在两个datepickers onchange中选择的值（不提交表单），并将这些值传递给我的控制器，以便我可以减去它们的值并获得这两个日期之间的差额。

请帮忙！

Answer 1

将ID标签添加到您的HTML输入代码段中，以更轻松地引用它们。

您的片段，已更新

 <div class='input-group date datepicker1'>
   <input  id="inputOne" data-format="dd/mm/yyyy" name="startDate" placeholder="DD/MM/YYYY" type='text' class="form-control" required/>
       <span class="input-group-addon">
           <span class="glyphicon glyphicon-calendar"></span>
       </span>
  </div>

  <div class='input-group date datepicker2'>
    <input  id="inputTwo" data-format="dd/mm/yyyy" name="endDate" placeholder="DD/MM/YYYY" type='text' class="form-control" required/>
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
        </span>
  </div>

现在，由于我们正在使用非活动节点，因此可以使用JS快速引用输入，这就像获取值并监视change事件一样容易。 注意：输入字段中有一个要监听的特定事件，它不像onchange那样多虫或骇客。

JS获取值看起来像这样：

var inptOne = document.querySelector('#inputOne');
var inptTwo = document.querySelector('#inputTwo');

function getValueOne() {
    var valOne = inptOne.value;
    return valOne
}

function getValueTwo() {
    var valTwo = inptTwo.value;
    return valTwo
}

    // NOTE THE USE OF "input" INSTEAD OF "onchange"
    // THIS WORKS NICELY WITH INPUT FIELDS
    document.body.addEventListener("input", getValueOne, false);
    document.body.addEventListener("input", getValueTwo, false);

上面的代码将使您能够进一步操纵输入值。

Answer 2

一种方法是使用ag：link标记。

您可以查看http://grails.github.io/grails-doc/3.0.x/ref/Tags/link.html了解更多信息。

或者，您可以只使用普通的g：textfield标记。

<g:textField name="startDate" required="" value="${yourDomainClassInstance?.startDate}"/>