2017-08-19 3 views
0

Ich versuche, eine Datumsauswahl basierend auf Groovy/Grails zu machen. Ich bin mit HTML nicht sehr vertraut, aber ich habe es geschafft, einen Auswahlbereich zu erstellen, in dem ein Kalender angezeigt wird, wenn der Benutzer darauf klickt und dann das Datum richtig ausgewählt und in der Datenbank gespeichert wird. Aber ich möchte noch eins machen, um es als Enddatum zu verwenden. Ich habe viele Dinge ausprobiert, aber ich habe es nicht geschafft. Kann jemand helfen? Dies ist der Code so weit:HTML 2 Bereiche mit dem gleichen Inhalt

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="layout" content="main"/> 
    <title>WannabeDoodle</title> 

    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 

    <script> 
     $(document).ready(function() { 
     $("#datepicker").datepicker(); 
     }); 
    </script> 

</head> 
<body> 

    <center><h1><b>Schedule an event</b></h1></center> 
    <br> 
    <center><font color="#2977C1">1. Generals ></font> <b>2. Set the date ></b> 3. Invite</center> 
    <br> 

    <g:form controller="SetDate" action="next"> 

     <div class="fieldcontain"> 

      &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; 
      <form> 
       <label for="startDate">Select date</label> 
       <g:textField name="startDate" id="datepicker" value="${startDate}"/> 
      </form> 
      <br><br> 

      <center> 
      <a href="http://localhost:8080/Groodle/CreateGenerals"><font color=#2875bd>Back</font></a> 
      &emsp; 
      <g:actionSubmit class="buttons" value="Next"/> 
      </center> 

     </div> 
    </g:form> 

</body> 
</html> 

Antwort

0

Ich habe es behoben. Ich habe eine zweite Datums-ID mit dem Namen datepicker2 im Skript erstellt und diese am Enddatum verwendet.

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="layout" content="main"/> 
    <title>WannabeGroodle</title> 

    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 

    <script> 
     $(document).ready(function() { 
     $("#datepicker").datepicker(); 
     $("#datepicker2").datepicker(); 
     }); 
    </script> 

</head> 
<body> 

    <center><h1><b>Schedule an event</b></h1></center> 
    <br> 
    <center><font color="#2977C1">1. Generals ></font> <b>2. Set the date ></b> 3. Invite</center> 
    <br> 

    <g:form controller="SetDate" action="next"> 

     <div class="fieldcontain"> 

      <form> 
       &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; 
       <label for="startDate">Select date</label> 
       <g:textField name="startDate" id="datepicker" value="${startDate}"/>  
       <br><br> 

       &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; 
       <label for="endDate">Select end date</label> 
       <g:textField name="endDate" id="datepicker2" value="${endDate}"/>    
      </form> 
      <br><br><br> 

      <center> 
      <a href="http://localhost:8080/Groodle/CreateGenerals"><font color=#2875bd>Back</font></a> 
      &emsp; 
      <g:actionSubmit class="buttons" value="Next"/> 
      </center> 

     </div> 
    </g:form> 

</body> 
</html> 
Verwandte Themen