Skip to content

Commit

Permalink
Added full ajax support to DateTimePicker component
Browse files Browse the repository at this point in the history
  • Loading branch information
@asterd
asterd committed Aug 5, 2016
1 parent 71191a1 commit 9e9b7e0
Show file tree
Hide file tree
Showing 5 changed files with 139 additions and 13 deletions.
15 changes: 15 additions & 0 deletions src/main/java/net/bootsfaces/component/dateTimePicker/DateTimePicker.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,10 @@

import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Collection;
import java.util.Collections;
import java.util.HashMap;
import java.util.Locale;
import java.util.Map;
Expand Down Expand Up @@ -49,6 +52,10 @@ public class DateTimePicker extends DateTimePickerCore
public static final String COMPONENT_FAMILY = "net.bootsfaces.component";

public static final String DEFAULT_RENDERER = "net.bootsfaces.component.dateTimePicker.DateTimePicker";

private static final Collection<String> EVENT_NAMES = Collections
.unmodifiableCollection(Arrays.asList("blur", "change", "click", "dblclick", "focus", "keydown",
"keypress", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "select"));

public DateTimePicker() {
Tooltip.addResourceFiles();
Expand All @@ -70,6 +77,14 @@ public Map<String, String> getJQueryEvents() {
result.put("dtchange", "dp.change");
return result;
}

public Collection<String> getEventNames() {
return EVENT_NAMES;
}

public String getDefaultEventName() {
return "click";
}

/**
* Manage EL-expression for snake-case attributes
Expand Down
23 changes: 18 additions & 5 deletions src/main/java/net/bootsfaces/component/dateTimePicker/DateTimePickerRenderer.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,14 +44,20 @@ public class DateTimePickerRenderer extends CoreRenderer {
@Override
public void decode(FacesContext context, UIComponent component) {
DateTimePicker dtp = (DateTimePicker) component;
String clientId = dtp.getClientId();
String subVal = context.getExternalContext().getRequestParameterMap().get(dtp.getClientId());

if (dtp.isDisabled() || dtp.isReadonly()) {
return;
}

// System.out.println("Submitted value = " + subVal);
if (subVal != null) {
dtp.setSubmittedValue(subVal);
dtp.setValid(true);
}
new AJAXRenderer().decode(context, dtp);
new AJAXRenderer().decode(context, dtp, clientId + "_Input");
new AJAXRenderer().decode(context, dtp, clientId);
}

/**
Expand Down Expand Up @@ -148,7 +154,7 @@ private String encodeHTML(FacesContext fc, ResponseWriter rw, DateTimePicker dtp

if (label != null) {
rw.startElement("label", dtp);
rw.writeAttribute("for", "input_" + clientId, "for"); // "input_" + clientId
rw.writeAttribute("for", clientId + "_Input", "for"); // "input_" + clientId
generateErrorAndRequiredClass(dtp, rw, clientId, dtp.getLabelStyleClass());
writeAttribute(rw, "style", dtp.getLabelStyle());

Expand Down Expand Up @@ -187,14 +193,16 @@ private String encodeHTML(FacesContext fc, ResponseWriter rw, DateTimePicker dtp
// input
rw.startElement("input", dtp);
rw.writeAttribute("type", "text", null);
rw.writeAttribute("id", clientId, null);
rw.writeAttribute("id", clientId + "_Input", null);
rw.writeAttribute("name", clientId, null);
rw.writeAttribute("class", "form-control " + getErrorAndRequiredClass(dtp, clientId), "class");
if(BsfUtils.isStringValued(dtp.getPlaceholder())) rw.writeAttribute("placeholder", dtp.getPlaceholder(), null);
if (v != null) {
rw.writeAttribute("value", getValueAsString(v, fc, dtp), null);
}
Tooltip.generateTooltip(fc, dtp, rw);
// Render Ajax Capabilities
AJAXRenderer.generateBootsFacesAJAXAndJavaScript(FacesContext.getCurrentInstance(), dtp, rw);
rw.endElement("input");

rw.endElement("div");
Expand All @@ -210,7 +218,7 @@ else if ("inline".equals(mode))

// write the input item
rw.startElement("input", dtp);
rw.writeAttribute("id", clientId+"Input", null);
rw.writeAttribute("id", clientId + "_Input", null);
rw.writeAttribute("name", clientId, null);
rw.writeAttribute("type", "hidden", "type");
if (v != null) {
Expand All @@ -230,14 +238,16 @@ else if ("inline".equals(mode))
// input
rw.startElement("input", dtp);
rw.writeAttribute("type", "text", null);
rw.writeAttribute("id", clientId+"input", null);
rw.writeAttribute("id", clientId + "_Input", null);
rw.writeAttribute("name", clientId, null);
rw.writeAttribute("class", "form-control " + getErrorAndRequiredClass(dtp, clientId), "class");
if(BsfUtils.isStringValued(dtp.getPlaceholder())) rw.writeAttribute("placeholder", dtp.getPlaceholder(), null);
if (v != null) {
rw.writeAttribute("value", getValueAsString(v, fc, dtp), null);
}
Tooltip.generateTooltip(fc, dtp, rw);
// Render Ajax Capabilities
AJAXRenderer.generateBootsFacesAJAXAndJavaScript(FacesContext.getCurrentInstance(), dtp, rw);
rw.endElement("input");

// span
Expand Down Expand Up @@ -329,6 +339,9 @@ private void encodeJS(FacesContext fc, ResponseWriter rw, DateTimePicker dtp, St
" $('#" + BsfUtils.escapeJQuerySpecialCharsInSelector(clientId) + "').val( e.date.format(" + displayFormat + ") ); " +
"});", null);
}
if(dtp.isDisabled()) {
rw.writeText("$('" + fullSelector + "').disable(); ", null);
}
rw.endElement("script");
new AJAXRenderer().generateBootsFacesAJAXAndJavaScriptForJQuery(fc, dtp, rw, fullSelector, null);
}
Expand Down
4 changes: 2 additions & 2 deletions src/main/java/net/bootsfaces/render/CoreRenderer.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@ protected void renderPassThruAttributes(FacesContext context, UIComponent compon
* @throws IOException
*/
protected void generateErrorAndRequiredClass(UIInput input, ResponseWriter rw, String clientId) throws IOException {
String styleClass = getErrorAndRequiredClass(input, clientId);
getErrorAndRequiredClass(input, clientId);
generateErrorAndRequiredClass(input, rw, clientId, null);
}

Expand Down Expand Up @@ -185,7 +185,7 @@ protected void decodeBehaviors(FacesContext context, UIComponent component) {
if (!(component instanceof ClientBehaviorHolder)) {
return;
}

Map<String, List<ClientBehavior>> behaviors = ((ClientBehaviorHolder) component).getClientBehaviors();
if (behaviors.isEmpty()) {
return;
Expand Down
84 changes: 84 additions & 0 deletions src/main/meta/META-INF/bootsfaces-b.taglib.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6462,18 +6462,102 @@
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when input element loses focus.]]></description>
<name>onblur</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when input element loses focus and its value has been modified since gaining focus.]]></description>
<name>onchange</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[OnClick DHTML event .]]></description>
<name>onclick</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[JavaScript to be executed when ajax completes with success.]]></description>
<name>oncomplete</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when input element is double clicked.]]></description>
<name>ondblclick</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[JavaScript event to manage date time change.]]></description>
<name>ondtchange</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when input element receives focus.]]></description>
<name>onfocus</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a key is pressed down over input element.]]></description>
<name>onkeydown</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a key is pressed and released over input element.]]></description>
<name>onkeypress</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a key is released over input element.]]></description>
<name>onkeyup</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a pointer input element is pressed down over input element.]]></description>
<name>onmousedown</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a pointer input element is moved within input element.]]></description>
<name>onmousemove</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a pointer input element is moved away from input element.]]></description>
<name>onmouseout</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a pointer input element is moved onto input element.]]></description>
<name>onmouseover</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when a pointer input element is released over input element.]]></description>
<name>onmouseup</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[Client side callback to execute when text within input element is selected by user.]]></description>
<name>onselect</name>
<required>false</required>
<type>java.lang.String</type>
</attribute>
<attribute>
<description><![CDATA[The placeholder attribute shows text in a field until the field is focused upon, then hides the text.]]></description>
<name>placeholder</name>
Expand Down
26 changes: 20 additions & 6 deletions xtext/BootsFaces.jsfdsl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -566,7 +566,7 @@ widget datepicker
+responsive
}

widget dateTimePicker
widget dateTimePicker
implemented_by net.bootsfaces.component.DateTimePicker
has_tooltip
is_responsive
Expand All @@ -583,23 +583,37 @@ widget dateTimePicker
format "See momentjs' docs for valid formats. Format also dictates which components are shown, e.g. MM/dd/YYYY will not display the time picker."
icon "Picker Icon, can be one of the Bootstrap icon names. "
icon-awesome "Font Awesome Icon to show in this DateTimePicker, can be one of the Font Awesome icon names."
immediate Boolean "Flag indicating that, if this component is activated by the user, notifications should be delivered to interested listeners and actions immediately (that is, during Apply Request Values phase) rather than waiting until Invoke Application phase. Default is false."
immediate Boolean "Flag indicating that, if this component is activated by the user, notifications should be delivered to interested listeners and actions immediately (that is, during Apply Request Values phase) rather than waiting until Invoke Application phase. Default is false."
initial-date "Sets the picker default date/time. Overrides useCurrent. Default: false. Accepts: date, moment, string."
keep-invalid Boolean "Will cause the date picker to not revert or overwrite invalid dates. Default: false."
keep-open Boolean "Will cause the date picker to stay open after selecting a date if no time components are being used. Deafult: false."
label inherited "An optional label of the field. The label is only shown if you also set render-attribute='true'. The label is also used for error messages."
label inherited "An optional label of the field. The label is only shown if you also set render-attribute='true'. The label is also used for error messages."
label-style "The CSS inline style of the label."
label-style-class "The CSS class of the label."
locale "The desired locale. It uses the moment.js locales."
min-date "Prevents date/time selections before this date. minDate will override defaultDate and useCurrent if either of these settings are the same day since both options are invalid according to the rules you've selected. Default: false, Accepts: date, moment, string."
max-date "Prevents date/time selections after this date. minDate will override defaultDate and useCurrent if either of these settings are the same day since both options are invalid according to the rules you've selected. Default: false, Accepts: date, moment, string."
ondtchange "JavaScript event to manage date time change."
onblur inherited "Client side callback to execute when input element loses focus."
onchange inherited "Client side callback to execute when input element loses focus and its value has been modified since gaining focus."
onclick inherited "OnClick DHTML event ."
oncomplete "JavaScript to be executed when ajax completes with success."
ondblclick inherited "Client side callback to execute when input element is double clicked."
ondtchange "JavaScript event to manage date time change."
onfocus inherited "Client side callback to execute when input element receives focus."
onkeydown inherited "Client side callback to execute when a key is pressed down over input element."
onkeypress inherited "Client side callback to execute when a key is pressed and released over input element."
onkeyup inherited "Client side callback to execute when a key is released over input element."
onmousedown inherited "Client side callback to execute when a pointer input element is pressed down over input element."
onmousemove inherited "Client side callback to execute when a pointer input element is moved within input element."
onmouseout inherited "Client side callback to execute when a pointer input element is moved away from input element."
onmouseover inherited "Client side callback to execute when a pointer input element is moved onto input element."
onmouseup inherited "Client side callback to execute when a pointer input element is released over input element."
onselect inherited "Client side callback to execute when text within input element is selected by user."
placeholder "The placeholder attribute shows text in a field until the field is focused upon, then hides the text."
process "Comma or space separated list of ids or search expressions denoting which values are to be sent to the server."
rendered Boolean inherited "Boolean value to specify the rendering of the component, when set to false the component will not be rendered."
render-label Boolean default "net.bootsfaces.component.ComponentUtils.isRenderLabelDefault()" "Allows you to suppress automatic rendering of labels. Used by AngularFaces, too."
required Boolean "Boolean value Require input in the component when the form is submitted."
render-label Boolean default "net.bootsfaces.component.ComponentUtils.isRenderLabelDefault()" "Allows you to suppress automatic rendering of labels. Used by AngularFaces, too."
required Boolean "Boolean value Require input in the component when the form is submitted."
required-message "Message to show if the user did not specify a value and the attribute required is set to true."
show-button-panel Boolean "Boolean value to specify if row Buttons to the bottom of calendar should be shown (all button at once)."
show-date Boolean default "true" "By setting this to false you can deactivate the date part of the dateTimePicker. Is ignored if the attribute 'format' is used.."
Expand Down

0 comments on commit 9e9b7e0

Please sign in to comment.