I have trouble calling timepicker with class and passing data-values to the script.
So what i have so far is one loop that for each entry it will create
foreach($data as $value){
$min_hour = $value['minhour']; // returns value from DB like 7 to 12
echo '<td><input type="text" value="" class="schedule-timepicker" data-minhour="'.$min_hour.'" data-minminutes="30" data-maxhour="17" data-maxminutes="00"></td>';
}
Then in js file I have
$(document).ready(function(){
$('.schedule-timepicker').timepicker({
timeFormat: 'HH:mm:ss',
minDate: new Date(1, 1, 1, $('.schedule-timepicker').data('minhour'), 00),
maxDate: new Date(1, 1, 1, $('.schedule-timepicker').data('maxhour'), 00),
});
});
Problem is that the timepicker is called out and works but every input has the same minimum hours value as the first one. Please help how to resolve this.
Thanks.
So help from cyberRobot # forums.phpfreaks.com pointed out that I have made a mistake in the code and I want to share it with others just in case it will help someone else in the future.
$('.schedule-timepicker').each(function () {
$(this).timepicker({
timeFormat: 'HH:mm:ss',
minDate: new Date(1, 1, 1, $(this).data('minhour'), 0),
maxDate: new Date(1, 1, 1, $(this).data('maxhour'), 0)
});
});
PS. Thanks for not helping.!
And to the stupid prick who voted a minus at my help request .. Fu*k you.
Related
I was trying to make use of bootstrap date picker, and make the user to select next day or above in the calendar.
How to make the (data-date-start-date="12AM next day") instead of (data-date-start-date="+1d").
To be precise, the selected insurance policy needs be covered from next day 12AM.
I'm banging my head from last couple of days, tried most of the known probabilities.
It needs to be set via Bootstrap date picker! Any help would be highly appreciated.
<div class="input-group date" data-provide="datepicker" data-date-autoclose="true" data-date-start-view="0" data-date-force-parse="false" data-date-start-date="+1d"></div>
Try this:
<script type="text/javascript">
$(function () {
var d = new Date();
d.setDate(d.getDate() + 1); //this will set tomorrow
d.setHours(0, 0, 0, 0); //this will set 12 AM
$('#datetimepicker1').datetimepicker({
defaultDate: d,
});
});
</script>
bootstrap-datepicker is not designed to be concerned with time (search the documentation for the word "time").
There are other libraries that help with picking dates and times.
Hi I've got follow code:
angular.module("myApp", []).controller("myController", function($scope) {
$scope.currentOption;
$scope.setCurrentTimespan = function() {
//CODE HERE
};
$scope.timespanList = [{
id: 1,
name: 'morning',
startDate: '19.09.2016 06:00',
endDate: '19.09.2016 11:59'
}, {
id: 2,
name: 'noon',
startDate: '19.09.2016 12:00',
endDate: '19.09.2016 13:29'
}, {
id: 3,
name: 'afternoon',
startDate: '19.09.2016 13:30',
endDate: '19.09.2016 18:29'
}, {
id: 4,
name: 'evening',
startDate: '19.09.2016 18:30',
endDate: '19.09.2016 23:59'
}, {
id: 5,
name: 'night',
startDate: '20.09.2016 00:00',
endDate: '20.09.2016 05:59'
}];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
<select ng-options="option as option.name for option in timespanList" ng-model="currentOption"></select>
</div>
I've got from the backend a object with items for my select. In this list there are some timespans like morning, noon, afternoon etc. This timespans have a startDate and an endDate, which also comes from the backend. For example, the timespan "morning" has follow startDate/endDate: [todays date] 06:00 / [todays date] 11:59. So what I want to do is, when I load the list and fill the select with ng-options, I would like to select the item from the list, which matches with the current timestamp. So I have to get the current date and time for example: 19.09.2016 09:45 and than search in the list the item which is defined for this timestamp and select it in the list. So I have to check the startDate/endDate with the current date / time. This should happen when the list was loaded.
So the result for my local time (19.09.2016 09:45) at this moment would be morning.
Has someone an idea how to do this? I didn't find any answers which can help me...Thanks
EDIT WITH SOLUTION:
I've found a perfect way to solve this problem: I found moment.js, which solves my requirements. After including it into my web app I start to use the queries and functions from moment.js to solve my problem. It works like this:
Get current timestamp (day, month, year, hour and minutes):
let currentTimestamp = moment(); //for example 19.09.2016 11:30
Than I loop throught my array with the timespans and parse the startDate/endDate with the moment.js to my required format DD.MM.YYYY HH:mm and then I can use the moment.js query isBetween() to check, if my currentTimestamp is between the startDate/endDate of each item like this:
this.timespanList.forEach(function(item) {
let startDate = moment(item.startDate, 'DD.MM.YYYY HH:mm'); // for example 19.09.2016 06:00
let endDate= moment(item.endDate, 'DD.MM.YYYY HH:mm'); // for example 19.09.2016 11:59
if(moment(currentTimestamp).isBetween(startDate, endDate)) {
$scope.currentOption = item;
}
});
So if the condition of the looped item is true, I can set the right option in my list. Here are some links of moment.js which describe, how to use it correcty - it's awesome!
moment.js docs: http://momentjs.com/docs/
moment.js parsing: http://momentjs.com/docs/#/parsing/
moment.js queries: http://momentjs.com/docs/#/query/
I hope this is usefull! An alternative solution from the answers which also would work is marked as correct. Thanks and cheers.
You can implement a custom filter to achieve this.
<select ng-options="option as option.name for option in timespanList | momentFilter" ng-model="currentOption"></select>
.filter('momentFilter',function(){
return function (object) {
var array = [];
angular.forEach(object, function (time) {
if(time.startDate.split(" ")[1] == '06:00' && time.endDate.split(" ")[1] == '11:59'){
array.push(time);
}
});
return array;
};
});
I have created a working plunker here.
Do little more work around to achieve this.
EDIT WITH SOLUTION FROM THE QUESTION:
I put my own solution which is in my edited question here so everyone can see it faster:
I've found a perfect way to solve this problem: I found moment.js, which solves my requirements. After including it into my web app I start to use the queries and functions from moment.js to solve my problem. It works like this:
Get current timestamp (day, month, year, hour and minutes):
let currentTimestamp = moment(); //for example 19.09.2016 11:30
Than I loop throught my array with the timespans and parse the startDate/endDate with the moment.js to my required format DD.MM.YYYY HH:mm and then I can use the moment.js query isBetween() to check, if my currentTimestamp is between the startDate/endDate of each item like this:
this.timespanList.forEach(function(item) {
let startDate = moment(item.startDate, 'DD.MM.YYYY HH:mm'); // for example 19.09.2016 06:00
let endDate= moment(item.endDate, 'DD.MM.YYYY HH:mm'); // for example 19.09.2016 11:59
if(moment(currentTimestamp).isBetween(startDate, endDate)) {
$scope.currentOption = item;
}
});
So if the condition of the looped item is true, I can set the right option in my list. Here are some links of moment.js which describe, how to use it correcty - it's awesome!
moment.js docs: http://momentjs.com/docs/
moment.js parsing: http://momentjs.com/docs/#/parsing/
moment.js queries: http://momentjs.com/docs/#/query/
I hope this is usefull! An alternative solution from the answers which also would work is marked as correct. Thanks and cheers.
I have this code in input:
utentiGrid.setWidget(1, 2, app.createLabel('Stato:'));
utentiGrid.setWidget(1, 3,
app.createListBox().setName('tipologia').addItem("Alpha").addItem("Beta"));
I select "Beta" and write ScriptDb
Then I take the record and visualize the result by modifying with this code:
utentiGrid.setWidget(1, 2, app.createLabel('Stato:'));
utentiGrid.setWidget(1, 3,
app.createListBox().setName('tipologia').addItem("Alpha").addItem("Beta"));
The problem
I want see my first selection ("Beta") and not "Alpha".
how can I do?
thank you
raffaele
p.s. are not a programmer but scriptDb is fantastic!
Just use the method setSelectedItem as bellow:
function doGet() {
var app = UiApp.createApplication();
var utentiGrid = app.createGrid(3, 4);
utentiGrid.setWidget(1, 2, app.createLabel('Stato:'));
var listBox = app.createListBox().setName('tipologia').addItem("Alpha").addItem("Beta");
//To select Beta use 1 as argument
listBox.setItemSelected(1, true);
utentiGrid.setWidget(1, 3, listBox);
app.add(utentiGrid);
return app;
}
If you change the argument to 0 the item selected will be alpha. If you have a third element, their index will be 2 and so one.
This is usually a simple error, yet I cannot find an obvious answer.
The full error is: 'ArgumentError: Error #1063: Argument count mismatch on com::previewSelection/selectionOn(). Expected 2, got 1.'
The obvious issue is that I'm only giving 1 bit of information and not 2, however I am definitely giving 2.
Main code:
function previewOn(e){
previewTile2.selectionOn(holdBar_mc, area1_mc);
previewTile2.removeEventListener(MouseEvent.CLICK, previewOn);
previewTile2.addEventListener(MouseEvent.CLICK, previewOff);
stage.setChildIndex(previews, 1);
var editOpen:Tween = new Tween(editTab, 'x', Strong.easeOut, editTab.x, -215, 1, true);
createTiles();
}
And the class file function:
public function selectionOn(holdBar:MovieClip, area1:MovieClip){
holdBarDown = new Tween(holdBar, 'y', Strong.easeOut, holdBar.y, 518, 1, true);
area1Up = new Tween(area1, 'y', Strong.easeOut, area1.y, area1.y - 300, 1, true);
}
Neither holdBar_mc or area1_mc are 'null' when traced.
The file runs without issue or slow-down, yet the Argument error constantly returns. Any ideas?
I have a list of dates stored in a MYSQL table, the idea is if the following field has valued 'completed' the row's date is unselectable in the jQueryUI datepicker. The dates are stored in the format YYYY-MM-DD.. how would I go about loading these 'completed' dates into a PHP array in a format for the datepicker to understand and disable them? JSON would be the obvious answer, I've spent the last couple of weeks getting to grips with it. Any example code of the jquery / php code would be greatly appreciated.
Many thanks in advance.
[ I have done research around the subject but it is not particularly well documented.. I've already got the datepicker showing valid days in a week. The jqueryUI datepicker seems to be able to do everything except make me a cup of tea. ]
EDIT: So I've managed to feed the array of dates with 'final' status through with JSON, I thought i'd provide the code if it helps anyone:
<?php
//connect to local db
include('functions.php');
connectLocal($localcon);
//locate rows with status set to final
$result = mysql_query("SELECT sendDate FROM my_table WHERE status='final'");
// return corresponding dates as json array
$i=0;
while($row = mysql_fetch_array($result))
{
$confirmedSends[$i] = array ( "sendDate" => $row['sendDate']);
$i++;
}
header('Content-type: application/json');
$jsonConfirmedSends = json_encode($confirmedSends);
echo $jsonConfirmedSends;
?>
This can retrieved with json in the form of a list of dates. The alert box pops up once for each date. About to get to work on presenting these to my datepicker array.
$.getJSON("get-disabled-dates.php",
function(data){
$.each(data, function(index, completed) {
alert(completed.sendDate);
});
});
Try following code to match your situation which disables set of dates. You can get dates by using json from your mysql table using $.getJSON of jquery
$(function() {
$( "#pickdate" ).datepicker({
dateFormat: 'dd MM yy',
beforeShowDay: checkAvailability
});
})
var $myBadDates = new Array("10 October 2010","21 October 2010","12 November 2010");
function checkAvailability(mydate){
var $return=true;
var $returnclass ="available";
$checkdate = $.datepicker.formatDate('dd MM yy', mydate);
for(var i = 0; i < $myBadDates.length; i++)
{
if($myBadDates[i] == $checkdate)
{
$return = false;
$returnclass= "unavailable";
}
}
return [$return,$returnclass];
}
source : http://codingforums.com/showthread.php?t=206879