I have a form that is using the calendar/date selection tool within Ektron, but when users select the current date (or any date, for that matter), it gives an error saying that you need to select a date in the past.
We haven't tooled around in the code for this form, but it almost sounds like a validation issue.
Here's the code, as is, from Ektron.
<p align="center" style="text-align: left;">Date program was presented:
<ektdesignns_calendar title="Date presented" id="Date_presented" onblur="design_validate_xpath('number(translate(.,\'-\',\'\')) <= number(translate($currentDate,\'-\',\'\'))',this,'Date in the past (required)');" ektdesignns_name="Date_presented" ektdesignns_caption="Date presented" ektdesignns_invalidmsg="Date in the past (required)" ektdesignns_validate="xpath:number(translate(.,'-','')) <= number(translate($currentDate,'-',''))" ektdesignns_basetype="calendar" ektdesignns_datatype="date" ektdesignns_validation="datePast-req" name="Date_presented">
<input type="text" size="30" readonly="readonly" unselectable="on" />
<img width="16" height="16" class="design_fieldbutton" alt="Select date" src="[skinpath]btncalendar.gif" unselectable="on" /></ektdesignns_calendar></p>
My knowledge on validation is limited, but it looks like it's parsing the date as an integer. Is it possible to add a day (+1) to the current date so that it interprets any day as valid as long as it's not in the future?
I guess this is a HTML form as opposed to a Smart form?
If so, have you checked the validation settings on the calendar field? If you edit the form, right-click on the field and choose Field Properties you will get the properties window. Go to the Validation tab and check the setting in the Validation drop down.
There are options for ensuring the date is in the past or the future. Perhaps one of these options has been set?
Related
OVERVIEW:
We are using this plugin -- bootstrap-datetimejs (https://github.com/Eonasdan/bootstrap-datetimepicker). And I have it setup to show the time only
$(".timePicker").datetimepicker({
format: 'LT'
});
We are using ractivejs for our javascript library and my html goes like this
<label for="apptEndTime">End Time</label>
<div class="timePicker">
<input name="apptEndTime" id="apptEndTime" class="form-control date" type="text" value="{{apptEndTime}}" />
</div>
<label>Duration (mins)</label>
<input type="number" class="form-control" value="{{duration}}" id="duration" />
so apptEndTime is binded to ractive object data apptEndTime, and so does the duration. In my code, I made it that if the duration increases, it will also update the value of apptEndTime data. It successfully updated and displayed the apptEndTime.
PROBLEM:
Though it successfully updated and displayed the apptEndTime, when I click the clock icon of the datetimepicker, it still shows the previous time. As you can see on the screenshot below, it already displayed as 11:58 PM but when I click the clock icon, it still shows as 11:57 PM
QUESTION:
Is there a way that when I updated the value of apptEndTime, the time on the time selection menu (when the clock icon is clicked) will also gets updated?
I've already tried googling for day regarding this, but I can't seem to find the right solution. Also tried checking the documentation but can't find any related information
Ok my teammate was able to answer this question. He just added this line of code
$('input[name=appEndTime]').closest('.timePicker').data("DateTimePicker").date(appointmentObj.apptEndTime);
Where:
$('input[name=appEndTime]') is the affected input field
closest('.timePicker'). The '.timePicker' here is the name of your datetimepicker class/id when you initialize datetimepicker
data("DateTimePicker"). You just follow this, because all functions should be accessed via data("DateTimePicker") as mentioned on the plugin page:
https://getdatepicker.com/4/Functions/
date(appointmentObj.apptEndTime). date is the function name (though it is not found on the list of functions from their page :( ). And appointmentObj.apptEndTime is value that I want to set on the menu
I am developing a Material form and have a md-datepicker input field that is showing Invalid Date on load instead of its placeholder:
When clicking on the drop down, the calendar starts all the way back in July 1934, which is less than ideal to say the least:
My code is pretty straight forward:
<div ng-switch-when="glide_date">
<md-input-container>
<label style="font-size: 130%; white-space: normal;" for="{{element.section_element_name}}">{{element.section_element_label}}</label>
<md-datepicker id = {{element.section_element_name}} ng-model="element.answer" md-placeholder="Enter date"></md-datepicker>
</md-input-container>
</div>
If I highlight and delete "Invalid Date", then my placeholder shows up correctly and the calendar drop down resets to the correct month.
Any ideas on how to correct this?
I need yours help. I have follow form:
{namespace femanager=In2code\Femanager\ViewHelpers}
<div class="femanager_fieldset femanager_membershipend control-group">
<label for="femanager_field_membershipend" class="control-label">
<f:translate key="tx_feusersplus_domain_model_user.membershipend" default="Expiration date of the membership"/>
</label>
<div class="controls">
<femanager:form.textfield
disabled="true"
id="femanager_field_membershipend"
property="membershipend"
class="input-block-level"
additionalAttributes="{femanager:Validation.FormValidationData(settings:settings,fieldName:'membershipend')}"
/>
</div>
</div>
And it get date in the next format - 1493942400. How I can make good look for date ? Thank you for advice!
Your property seems to be declared as integer (unix timestamp) in the model.
You can change the field to the following:
<femanager:form.textfield
disabled="true"
id="femanager_field_membershipend"
property="membershipend"
class="input-block-level" value="{yourModel.membershipend-> f:format.date(format: 'd.m.Y')}"
additionalAttributes="{femanager:Validation.FormValidationData(settings:settings,fieldName:'membershipend')}"
/>
This will format the property to a readable Date. But after that you will get problems saving the property correctly. If the property is really an integer, you need to write a converter for converting the date to an unix timestamp. It must work like here just in the reverse and I think TYPO3 does not have the correct converter for your needs out of the box.
I recommend you to change your property to DateTime (including the database field). Then you can use the DateTimeConverter of TYPO3 to save the data correctly.
EDIT: In your case the field is disabled="true" which should mean that the data will not become submitted. In that case you should not get problems with converting after submitting the form.
I have a country picker in my form like this:
<select class="bfh-countries text-left" name="country" id="country" data-country="DE">
</select>
I can get the value with jQuery like this:
$("#country").val()
but when i try to serialize the form with $("#myform").serializeArray() The value for "country" is an empty string.
How can i fix this?
I ran into this problem and it took me forever to find because there aren't any examples of it. What you really want to do is use data-name="country", which names the hidden variable on the back end as country. For the country picker, you can use the div tag as follows:
<div class="country bfh-selectbox bfh-countries" data-flags="true" data-filter="true" data-name="country" data-country="POSTBACK_VARIABLE_GOES_HERE"></div>
If you do this, you'll find a hidden variable that's added to the page as follows:
<input type="hidden" name="country" value="US">
The value above assumes you selected United States but it is entered as a 2 character code, which could then be entered as data-country above if you need to do server-side validation and display the page again without forcing the user to select the value all over again.
This was seriously a nightmare to find.
I'd like my form to include a certain value if the quantity is equal to 1 (via a text box).
I've managed to show what the total cost is using JavaScript and I could submit it with this value but I'm worried that when JavaScript is turned off the user will be able to submit the form without the extra fee being added. Therefor escaping the fee.
<form>
<label>Qunatity</label>
<input type="text" name="qyt" />
<input type="text" name="fee" value="250" />
<div class="total">[whatever the total is]</div>
<input type="submit" value="submit" />
</form>
Is there a way I can submit this form so that it submits 250 only if a quantity of 1 is added to the form? I'd like to avoid using a select input.
Will I need to split my form out into two stages to achieve this?
You need to check your logic in server-side code.
Most people have Javascript enabled, so you should do it in Javascript to provide a better experience, but you must always reproduce the logic on the server.
If you need to validate your input without JavaScript, have a server-side component (PHP?) to do the job and return the same form with an error message if no quantity was given. That way you don't have to split your form into two steps.
The best/safest way to handle this would be to do your total calculation on the server side. That way the data you store will always be correct.