I would like to know without using any plugin/library, is it possible to format bootstrap date input format.
My webservice will return ISO.DATE pattern = "yyyy-MM-dd", and bootstrap displays it in MM/DD/YYYY format. I want to change it to DD/MM/YYYY format.
Is it possible to do ? I googled and every one seem to be using some library. Since my requirement is simple, I do not want to use any library. Or do you think a library is required.
Any help is appreciated.
<div class="form-group">
<label for=displayFrom class="col-md-3 control-label"> Date </label>
<div class="col-md-4">
<form:input type="date" class="form-control" path="displayFrom" id="displayFrom"
placeholder="display From"/>
</div>
<div class="col-md-5 iserror">
<form:errors path="displayFrom"></form:errors>
</div>
</div>
You are using HTML5's date input which uses the YYYY-MM-DD format, which is unchangeable right now. Chrome and Opera uses the local computer's locale to set the format of the input, Firefox and IE uses the default YYYY-MM-DD.
Related
Currently I am using the vee-validate v4 library to validate all my form inputs, How can I use the datepicker with vee-validate to change the date format ? I am using schema format to validate the fields like :validation-schema="schema" And I have to change the date format to be mm/dd/yyyy
<Form class="row g-3" :validation-schema="schema" #submit="submit($event)" v-slot="{ errors }">
<div class="col-md-6">
<label for="inputdate" class="form-label"
>Expiration Date<span class="required-field"></span></label>
<Field
name="ExpiryDate"
type="date"
v-model="ExpiryDate"
placeholder="Enter date"
class="form-control"
id="inputdate"
:class="{ 'is-invalid': errors.ExpiryDate }"
/>
<div class="invalid-feedback">
{{ errors.ExpiryDate }}
</div>
</div>
</Form>
There is no direct way to achieve the validation of datepicker through vee-validate, you will have to handle it manually through code.
I have a long text 20 lines with HTML code that I need to use into a form test. For small texts I could use something like this:
browser.actions().mouseMove(element(by.id("field_bodytext")).sendKeys("BodyText <h2>Protractor</h2> Text1")).perform();
and it will work fine. But for 20 lines it does not. I have seen this information in Protractor API page, but can not see how to use it in my case:
http://www.protractortest.org/#/api?view=webdriver.WebElement.prototype.sendKeys
var form = driver.findElement(By.css('form'));
var element = form.findElement(By.css('input[type=file]'));
element.sendKeys('/path/to/file.txt');
form.submit();
There is an example for selenium that I do not see how to adapt: Selenium Webdriver enter multiline text in form without submitting it
This is the form field in Angular:
<div class="form-group">Wordhtml.com
<label class="form-control-label" jhiTranslate="jhipsterpressApp.post.bodytext" for="field_bodytext">Bodytext</label>
<textarea type="text" rows="10" cols="50" class="form-control" name="bodytext" id="field_bodytext"
[(ngModel)]="post.bodytext" required minlength="2" maxlength="65000">
<div [hidden]="!(editForm.controls.bodytext?.dirty && editForm.controls.bodytext?.invalid)">
<small class="form-text text-danger"
[hidden]="!editForm.controls.bodytext?.errors?.required" jhiTranslate="entity.validation.required">
This field is required.
</small>
<small class="form-text text-danger"
[hidden]="!editForm.controls.bodytext?.errors?.minlength" jhiTranslate="entity.validation.minlength" translateValues="{ min: 2 }">
This field is required to be at least 2 characters.
</small>
<small class="form-text text-danger"
[hidden]="!editForm.controls.bodytext?.errors?.maxlength" jhiTranslate="entity.validation.maxlength" translateValues="{ max: 65000 }">
This field cannot be longer than 65000 characters.
</small>
</div>
</textarea>
</div>
And the text to be inserted could be something like this:
<h2>What is JHipsterPress?</h2>
<ul>
<li>It is an open source and collaborative project made with Jhipster.</li>
<li>It is a live project that it is explained in its GitHub project. Explained? What do you mean? Whether you are a beginner that wants to find out an example about how to How to open access to the REST Api: or a more advance user who wants to see How to change DTOs to load attributes of not related entities: and see the actual code working, just visit the ReadMe file at GITHUB</li>
<li>And YES, you can use it for your own website.</li>
<li>At the same time JHipsterPress will try to create a community for Jhipster developers to join groups about different topics such as Websockets, Mapstruct, or anything you like.</li>
</ul>
<br />
Put the HTML in quotes `` as #lunin-roman is saying and then call it:
let htmltext = `<h2>What is JHipsterPress?</h2> and so on`;
element(by.id("field_bodytext")).sendKeys(htmltext);
and then use it in the element.sendKeys
I created a edit view for a EF Model and have a problem with the datepicker.
Whenever i try to edit a `dataset, the edit view don't show me the old date values.
This is my Edit.cshtml Code:
<div class="form-group">
<label asp-for="BestellungsDatum" class="control-label"></label>
<input asp-for="BestellungsDatum" type="date" class="form- control" value="#Model.BestellungsDatum" />
<span asp-validation-for="BestellungsDatum" class="text-danger"></span>
</div>
This is what it looks like, but there have to be the old value at this position:
When i change the input to type="text", the value is shown but there is no datepicker.. Any solutions on this?
type="date" generates the browsers HTML-5 datepicker if supported. The specifications require that the value be formatted in ISO format (yyyy-MM-dd) which is then displayed in accordance with the browsers culture.
Add the asp-format to format the value, and remove the value attribute (Tag Helpers correctly generate the value attribute for correct 2-way model binding and you should never attempt to add it yourself)
<input asp-for="BestellungsDatum" type="date" asp-format="{0:yyyy-MM-dd}" class="form-control" />
Note the HTML-5 datepicker is not supported in IE, and only in recent versions of FireFox. If you want a consistent UI, then consider using a jQuery datepicker instead.
Just like to add an addition to the accepted answer:
<input asp-for="BestellungsDatum" type="date" class="form-control" />
Rather than adding asp-format to the view, add DataFormatString to the data Model or ViewModel, so you don't have to add it to every view that uses it:
[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
public DateTime BestellungsDatum { get; set; }
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 am using laravel 4.2. Im learning laravel and find myself caught up in one problem and I have tried in many forums and I haven't found the answer anyware.
My problem is as follows:
I have this form embeded in a php view file:
{{Form::open(['route'=> 'home.store'])}}
<div class="container col-xs-5 ">
<form class="form-horizontal">
<div class="form-group col-xs-8">
<!-- Split button -->
<div class="btn-group">
<select name="country" class="btn btn-success dropdown-toggle" >
<option disabled selected>Escoger País</option>
<option>Argentina</option>
<option>Bolivia</option>
<option>Chile</option>
<option>Colombia</option>
<option>Costa Rica</option>
<option>Cuba</option>
<option>Ecuador</option>
<option>El Salvador</option>
<option>Guatemala</option>
<option>Honduras</option>
<option>México</option>
<option>Nicaragua</option>
<option>Panamá</option>
<option>Paraguay</option>
<option>Perú</option>
<option>Puerto Rico</option>
<option>Uruguay</option>
<option>Puerto Rico</option>
<option>República Dominicana</option>
<option>Venezuela</option>
</select>
</div>
</div>
</div>
{{Form::close()}}
Now, in home.store I have:
$user-> country = Input::get('country');
This is meant to be stored in a database table with a field named "country" that is of type ENUM with the same options as the form. It works perfectly when I pick options without ansi character codes. However when I choose the option that contains a spanish tilde (´),that is set in ansi code, they cannot get stored in the database.
Now, to check what is getting as input I used in home.store :
return Input::all();
And it ouputs:
{"_token":"ofyHW7ElogegKJwMXQL3HsbugCSnRxbtkm0GVQ8y","country":"Per\u00fa"}
I can recognize the problem as: acsii code ú is translated to java \u00fa.
I have checked everywhere in the framework (FormBuilder.php and HtmlBuilder.php)to see if something is being defined as java in laravel but everything is set to UTF-8, so as the database, and so as the meta tag in the html view (the browser is set to utf-8 too)
I would greatly appreciate anyone help on this.
Thank you so much.