Jquery datepicker date format - php

How do I get my date to display like this: "yy-mm-dd" inside my date input textbox after I have selected a date?
Information is reading from a database.
So I need it saved in a database again.
JavaScript:
<script>
$(document).ready(function() {
$("#from").datepicker();
});
</script>
Html code:
<div class="field">
<label>Date</label>
<input type="text" name="date" value="<?php value('date'); ?>" id="from" />
<?php if(isset($errors['date'])) { ?>
<div class="error"><?php echo $errors['date']; ?></div>
<?php } ?>
</div>
Things that I have tried:
http://docs.jquery.com/UI/Datepicker#option-dateFormat
http://docs.jquery.com/UI/Datepicker/formatDate
jQuery UI DatePicker - Date Format
jquery ui datepicker date format

Define the format during initialization
$("#from").datepicker({
dateFormat: 'yy-mm-dd'
});
The value is updated as well. See an example.

Related

Codeigniter using input datepicker cannot post to database

I am using a Codeigniter script purchased in Codecanyon. I need add the input datepicker but in Controller cannot get from UI picked date.
UI:
<input type="date" class="form-control datetimepicker" value="<?php echo date('Y-m-d'); ?>" name="deadline" id="deadline">
Controller :
$deadline = date("Y-m-d", strtotime($this->input->post('deadline')));
I have test to show before update database but it's display current time:
var_dump($deadline);
return;
The modal you're dealing with is outside the form. I made it that - using jquery - when the date field is changed, it updates the value of its hidden field which is in the form. So when the modal triggers form submission, the value of its date field is also submitted to the controller.
HTML:
<input type="hidden" name="deadline" id="deadlinehidden" value="" />
JS:
$("#deadline").on("change paste keyup", function() {
$("#pos-sale-form input[name='deadline']").val($(this).val());
});
you can use this:
<input name="deadline" type="text" value="2017-07-08" class="form-control datepicker" id="datepicker">
<script>
$( function() {
$( "#datepicker" ).datepicker();
} );
</script>
$date=$this->input->post('deadline');

running a single page with dynamic variable as query

I am developing a page that sum a summary of report. By default it only shows today. I am using this:
include $koneksi
$date ='current_date';
$query1 = mysqli_query($koneksi,"SELECT * from daftar where tanggal=subdate($date, 1)");
$result=mysqli_num_rows($query1);
And here is my HTML
<div class="count blue"><?php echo $result." people(s)"?></div>
And it works, the result of query is what I expected.
Now I need to change the value of $date variable with datepicker.
<div class='input-group date' id='myDatepicker'>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
I want it so that every time I click on datepicker the variable $date will change and the page will reload (same page but different query result ) by itself.
If you want the data to displayed in the same page, better you can use Angular. Here, just to show the flow I have used angularJs but the support for angularJs has been stopped so use Angular or reactJs as per your need (search more about it)
Use html to construct a form and using angularJs http.post(), post your form data to php
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<script>
$(document).ready(function(){
var date_input=$('input[name="inpDate"]'); //our date input has the name "date"
var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
var options={
format: 'yyyy-mm-dd',
container: container,
todayHighlight: true,
autoclose: true,
};
date_input.datepicker(options);
});
</script>
<form ng-submit="submit()">
<label>Date</label>
<input class="form-control" ng-model="inpDate" id="date" name="inpDate" placeholder="YYYY-MM-DD" type="text" required="required"/>
</form>
And write a separate angularJs file as below. On submit this will send date to the php file and get the response.
$scope.submit = function(){
var date1=$scope.inpDate;
$http.get('http://localhost/report/urfile.php?inpdate='+date1).success(function(shiftdata) {
$scope.dbValue = shiftdata;
console.log(JSON.stringify(shiftdata) );
});
}
after this modify your php will to receive the data and send a response accordingly.
Now the data is URL you can get it in ph like below.
urfile.php
$date = $_GET['inpdate'];

multiple datepicker in a page (php)

im trying to use two date picker in a page. it seems to worked fine but after clicked on the submit button the date entered is not the same as the choosen date. both of the date inserted to the database is 01-01-1970.
how can i fix this?
<div class="form-group">
<label class="control-label col-sm-4">Date Issued</label>
<div class="col-sm-5">
<input class="form-control" type="text" id="dateIssuedpc" name="dateissued" required class="form-control" placeholder="Enter Date Issued"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4">Date Expired</label>
<div class="col-sm-5">
<input class="form-control" type="text" id="dateExpiredpc" name="dateexpired" required class="form-control" placeholder="Enter Date Expired" />
</div>
</div>
<script>
$( function() {
$( "#dateIssuedpc").datepicker({
dateFormat: "dd-mm-yy",
changeMonth: true,
changeYear: true
});
$( "#dateExpiredpc" ).datepicker({
dateFormat: "dd-mm-yy",
changeMonth: true,
changeYear: true
});
} );
</script>
if field data type in database is datetime then
$dateexpired = $_POST['dateexpired'];
$new_dateexpired = date("Y-m-d H:i:s",strtotime($dateexpired));
$dateissued = $_POST['dateissued'];
$new_dateissued = date("Y-m-d H:i:s",strtotime($dateissued));
if field data type is date then
$dateexpired = $_POST['dateexpired'];
$new_dateexpired = date("Y-m-d",strtotime($dateexpired));
$dateissued = $_POST['dateissued'];
$new_dateissued = date("Y-m-d",strtotime($dateissued));
This is not datepicker problem, rather problem is with PHP code.
Mysql date format is always YYYY-MM-DD HH:II:SS
So while inserting data to mysql table, you have to convert the format for mysql
Ex:
$postDate = $_POST['date'];// just collect value from post fields.
$date = date("Y-m-d H:i:s",strtotime($postDate));
You need to format your date properly. First of all change format from dateFormat: "dd-mm-yy", to *dateFormat: "dd-mm-yyyy",* to better recognise year.
After that from php side you something like this
$dateissued = date("Y-m-d", strtotime($_POST['dateissued']) ); //MySql date format

How to dynamically set default date in datepicker

I'm using datepicker with the following script:
<?php print "$test_date" ?> --> returns 2014,10,25
<script>
$(function() {
$("#mydate").datepicker({
onSelect: function(dateText, inst) {
var dateAsString = dateText;
var date = $('#mydate').val();
var datex = date.replace(/[/]/g,"-"); // 01-01-2013 01:21
$('#mydatex').val(datex);
}
})
.datepicker("setDate",new Date());
//.datepicker("setDate","<?php echo $test_date; ?>"; --> this doen't work
// returns blank date
});
</script>
the default date is set to the current date. Is there a way to dynamically set the default date with a variable passed into my form from php? i.e When I render the form I pass into it $test_date which = "2014,12,25"
and here's the top of the form:
<form name="myForm" action="createevent.php" onsubmit="return validateForm()" method="get">
<h1 style="color:blue;">Skipper Input Page</h1>
<div class="skipperinput"">
<input type="text" id="mydate" name="mydate" value= ""/><br>
<label>Date</label>
<input type="hidden" id="mydatex" name="mydatex"/>
.datepicker("setDate", new Date("<?php echo $new_default_date; ?>"));

how to output the date from jquery ui datepicker and add a day each time its outputted

i have an a jquery ui datepicker and i need to pick the date from this and then output it in a div and then for each div i need to add one day to it.
the html
<?php $date = $_POST['datepicker']; ?>
<input name="datepicker" class="calendarInput" type="text" id="datepicker">
<div>
<?php echo($date) ?>
</div>
<div>
<?php echo($date) ?>
</div>
<div>
<?php echo($date) ?>
</div>
thanks for any help in advance.
You can do it using the onSelect callback.
$('#datepicker').datepicker({
onSelect: function(dateText) {
var date = $(this).datepicker('getDate');
date.setDate(date.getDate() + 1);
}
});
Assign ids to your divs and then you can modify the contents.

Categories