Ich versuche, die jQuery-Datepicker-Funktion zu verwenden, um Datumsfelder zu füllen, die Teil eines Objektsatzes in einer Hashmap sind.jQuery - Datepicker füllt nicht für hashmap-Datumsfelder
Wir verwenden STRUTS 1, um unsere Formulardaten abzubilden - und für die meisten unserer Daten ist dies ausreichend.
Ich habe diese Felder bereits überprüft und geschrieben, so dass sie durch manuelle Eingabe des Datums ausgefüllt werden können. Jetzt möchte ich den jQuery-Datumsauswahl hinzufügen, damit der Benutzer ein Datum aus einem Popup-Kalender auswählen kann. Ich verwende Chrome. Code-Ausschnitt unten.
<script>
$(function() {
$(".datePick").datepicker({
dateFormat: 'mm/dd/yy',
showOn: "button",
buttonImage: "images/calendar.png",
buttonImageOnly: true,
buttonText: "Select date",
onSelect: function(dateText,inst)
{
id=$(this).attr('id');
pos = id.indexOf("(") + 1;
counter = id.slice(pos, -1);
id=id.replace("("+counter+")","");
pieces = dateText.split("/");
$("#"+ id+"MM("+counter+")").val(pieces[0]);
$("#"+ id+"DD("+counter+")").val(pieces[1]);
$("#"+id +"YYYY("+counter+")").val(pieces[2]);
}
});
});
</script>
<!-- "counter" is an integer which keeps track of what iteration of the
hashmap is being accessed, propertyValue is a string that allows me to
dynamically change the property of each form-->
<tr>
<td align="right" colspan="1">
<label for="setOfObjectsStartMMDtH("+counter+")">
<%=label.makeLabel(XXXXForm.FORM_KEY_VALUE)%></label>
</td>
<td align="left" colspan="4">
<% propertyValue="setOfObjectsStartDtHMM("+counter+")";%>
<html:text property="<%=propertyValue%>" styleId="<%=propertyValue%>"
size="2" maxlength="2"/> /
<% propertyValue="setOfObjectsStartDtHDD("+counter+")";%>
<html:text property="<%=propertyValue%>" styleId="<%=propertyValue%>"
size="2" maxlength="2"/> /
<% propertyValue="setOfObjectsStartDtHYYYY("+counter+")";%>
<html:text property="<%=propertyValue%>" styleId="<%=propertyValue%>"
size="4" maxlength="4"/>
<% propertyValue="setOfObjectsStartDtH("+counter+")";%>
<html:hidden styleId="<%=propertyValue%>" property="<%=propertyValue%>"
styleClass="datePick"+counter></html:hidden>
Hier sehen meine Getter und Setter aus.
private final HashMap setOfObjects = new HashMap();
/**
* @param startDtH the setOfObjectsStartDtH to set
*/
public void setSetOfObjectsStartDtH(String key, String startDtH) {
setOfObjects obj = getSetOfObjects(key);
obj.setStartDtH(startDtH);
}
/**
* @return the startDtH
*/
public String getSetOfObjectsStartDtH(String key) {
if(setOfObjectss.containsKey(key)){
SetOfObjects obj = getSetOfObjects(key);
return obj.getStartDtH();
}
return "";
}
/**
* @param startDtHDD the startDtHDD to set
*/
public void setSetOfObjectsStartDtHDD(String key, String startDtHDD) {
SetOfObjects obj = getSetOfObjects(key);
obj.setStartDtHDD(startDtHDD);
}
/**
* @return the startDtHDD
*/
public String getSetOfObjectsStartDtHDD(String key) {
if(setOfObjectss.containsKey(key)){
SetOfObjects obj = getSetOfObjects(key);
return obj.getStartDtHDD();
}
return "";
}
/**
* @param startDtHMM the startDtHMM to set
*/
public void setSetOfObjectsStartDtHMM(String key, String startDtHMM) {
SetOfObjects obj = getSetOfObjects(key);
obj.setStartDtHMM(startDtHMM);
}
/**
* @return the startDtHMM
*/
public String getSetOfObjectsStartDtHMM(String key) {
if(setOfObjectss.containsKey(key)){
SetOfObjects obj = getSetOfObjects(key);
return obj.getStartDtHMM();
}
return "";
}
/**
* @param startDtHYYYY the startDtHYYYY to set
*/
public void setSetOfObjectsStartDtHYYYY(String key, String startDtHYYYY) {
SetOfObjects obj = getSetOfObjects(key);
obj.setStartDtHYYYY(startDtHYYYY);
}
/**
* @return the startDtHYYYY
*/
public String getSetOfObjectsStartDtHYYYY(String key) {
if(setOfObjectss.containsKey(key)){
SetOfObjects obj = getSetOfObjects(key);
return obj.getStartDtHYYYY();
}
return "";
}
private SetOfObjects getSetOfObjects(String key){
if(setOfObjects.containsKey(key))
return (SetOfObjects)setOfObjects.get(key);
SetOfObjects set = new SetOfObjects();
set.setId(Integer.parseInt(key));
setOfObjects.put(key, set);
return set;
}
Und hier ist es, was die SetOfObjects wie folgt aussieht:
public class SetOfObjects{
private String startDtH = "";
private String startDtHMM = "";
private String startDtHDD = "";
private String startDtHYYYY = "";
/**
* @param startDtH the startDtH to set
*/
public void setStartDtH(String startDtH) {
startDtH = startDtH;
}
/**
* @return the startDtH
*/
public String getStartDtH() {
return startDtH;
}
/**
* @param startDtHMM the startDtHMM to set
*/
public void setStartDtHMM(String startDtHMM) {
this.startDtHMM = startDtHMM;
}
/**
* @return the startDtHMM
*/
public String getStartDtHMM() {
return startDtHMM;
}
/**
* @param startDtHDD the startDtHDD to set
*/
public void setStartDtHDD(String startDtHDD) {
this.startDtHDD = startDtHDD;
}
/**
* @return the startDtHDD
*/
public String getStartDtHDD() {
return startDtHDD;
}
/**
* @param startDtHYYYY the startDtHYYYY to set
*/
public void setStartDtHYYYY(String startDtHYYYY) {
this.startDtHYYYY = startDtHYYYY;
}
/**
* @return the startDtHYYYY
*/
public String getStartDtHYYYY() {
return startDtHYYYY;
}
}
Und schließlich ist hier die generierten HTML.
<script>
$(function() {
$(".datePick").datepicker({
dateFormat: 'mm/dd/yy',
showOn: "button",
buttonImage: "images/calendar.png",
buttonImageOnly: true,
buttonText: "Select date",
onSelect: function(dateText,inst)
{
id=$(this).attr('id');
pos = id.indexOf("(") + 1;
counter = id.slice(pos, -1);
id=id.replace("("+counter+")","");
pieces = dateText.split("/");
$("#"+ id+"MM("+counter+")").val(pieces[0]);
$("#"+ id+"DD("+counter+")").val(pieces[1]);
$("#"+id +"YYYY("+counter+")").val(pieces[2]);
}
});
});
</script>
<tr>
<td align="right" colspan="1">
<label for="setOfObjectsStartMMDtH("+counter+")"><label class="normal">Set of Objects</label></label>
</td>
<td align="left" colspan="4">
<input type="text" name="setOfObjectsStartDtHMM(0)" maxlength="2" size="2" value="" id="setOfObjectsStartDtHMM(0)"> /
<input type="text" name="setOfObjectsStartDtHDD(0)" maxlength="2" size="2" value="" id="setOfObjectsStartDtHDD(0)"> /
<input type="text" name="setOfObjectsStartDtHYYYY(0)" maxlength="4" size="4" value="" id="setOfObjectsStartDtHYYYY(0)">
<input type="hidden" name="setOfObjectsStartDtH(0)" value="" class="datePick" id="setOfObjectsStartDtH(0)">
((Anmerkung: Ich bin mir bewusst, dass die ‚‚+ Zähler +‘‘ ist nicht ein entsprechendes Etikett zu schaffen - aber Festsetzung dieser die Kalenderfunktion nicht festgelegt hat))
Der Kalender selbst erscheint mit kein Problem, aber wenn ich ein Datum auswähle, springt die Seite nach oben, und die Datumsfelder sind nicht gefüllt - keine Fehlermeldung erscheint irgendwo auf der Seite, und der Kalender verschwindet auch nicht, wie es normalerweise nach der Auswahl eines Datums wäre .
Was würde dazu führen, dass der Kalender für den jQuery-Datapicker angezeigt wird, aber ich die Kalenderwerte nicht zuweisen kann?
Was hat das mit Java zu tun? – Compass
@Compass Beachten Sie die Java-Snippets - obwohl es nicht besonders wichtig ist. Ich werde dieses Tag entfernen. – Zibbobz
In der Konsole für den Entwickler-Modus/Tools erhalten Sie einen Fehler? – dama