I have used bootstrap datepicker, i included return date.valueOf() < now.valueOf() ? 'disabled' : '' in onRender function to disable past dates the problem is when i select previous year of any month it shows active, how to disable active class if disabled exist
comment this active function in your js.
if (prevMonth.valueOf() === currentDate) {
clsName += ' active';
}
Like This
// if (prevMonth.valueOf() === currentDate) {
// clsName += ' active';
// }
--------------- Month Disabled - comment this active function ------------
// if (currentYear === year) {
// months.eq(this.date.getMonth()).addClass('active');
// }
--------------- Year Disabled - just remove active class in this code ------------
html += '<span class="year'+(i === -1 || i === 10 ? ' old' : '')+(currentYear === year ? ' ' : '')+'">'+year+'</span>';
This is My Screenshort
Related
I have the following function that works fine until I try to update the gender or age fields
since there is a check against the src doc that is causing the failure how to go about it in a way that will allow updates to other fileds ?, without erroring out when there is no (count) in the incoming update ?
batch.update(doc(db, 'docPath', { gender: selected.gender });
function dataCheckUpdate(requestData, resourceData) {
return (
// gender
requestData.gender is string &&
// age
requestData.age is number &&
// count
requestData.count is number &&
requestData.count == resourceData.count + 1 &&
// (!('count' in requestData.keys()) || (requestData.count == resourceData.count + 1)) &&
requestData.count <= 2 &&
);
}
// call
dataCheckUpdate(request.resource.data, resource.data)
I use the official FullCalendar VueJS component, and I would like to update the current range displayed in the view (DayGridMonth here) : 1 month, 2 months, 3 months, custom period
According to the "documentation", the visibleRange property can be updated thanks to the function setOption() (https://fullcalendar.io/docs/visibleRange), but it doesn't work for me : the property is well updated in component, but the view wasn't updated.
I also tried to update state manually, without result.
This is my draft function to do this
updateCurrentDate: function () {
const calendarApi = this.$refs.fullCalendar.getApi();
const date = new Date(calendarApi.getDate());
let endRange;
this.currentPeriodRange = calendarApi.state.dateProfile.activeRange;
this.currentPeriodLabel = moment(date).format('MMMM YYYY');
if (this.currentView === 'month') {
endRange = moment(this.currentPeriodRange.start).add(2, 'month');
this.currentPeriodRange.end = endRange.toDate();
// Not working
calendarApi.setOption('visibleRange', this.currentPeriodRange);
// No one of these test work
calendarApi.state.dateProfile.activeRange = this.currentPeriodRange; //
calendarApi.state.dateProfile.currentRange = this.currentPeriodRange;
calendarApi.state.dateProfile.renderRange = this.currentPeriodRange;
}
if (this.currentPeriodRange.start !== this.currentPeriodRange.end) {
this.currentPeriodLabel = this.currentPeriodLabel + ' - ' + endRange.format('MMMM YYYY');
}
return;
},
Thanks for reading and answering
I want to show owl-carousel image-slides in two or three horizontal row, based on setting. How it is possible?
Also i need that, in mobile view(small screen), the image-slide should be single and should be in single row.
Something like this (guess below numbers are images):
Slides(single row): 1 2 3 4 5 6 7 8 9
I need:(if Two row)
1 3 5 7 9
2 4 6 8
I need:(if Three row)
1 4 7
2 5 8
3 6 9
I have found this answer on my own, this will helps someone who need this if it is in their project-requirement.
Note: in new owl-carousel js (version 2.3.4), just make minor property change on init-code of below jquery code.
i am putting the code here:
below is the .Net MVC HTML CODE:
Here you can see in div tag class name "clsBannerAds", we will write jquery for append the multiple row in owl-carouesel. Also see in div tag there are some data- attributes which helps to make owl-carousel slides to show dynamically, as like how many rows, or how many slides in one column (based on setting in db).
HTML::>>
<div class="clsBannerAds" data-columncount="#(Model.AdvertGroup.BlockColumnSize ?? 1)" data-autoplayinterval="#(Model.AdvertGroup.CarouselRefreshRate)" data-rowcount="#(Model.AdvertGroup.BlockRowSize ?? 1)" data-displaymode="#Model.AdvertGroup.DisplayMode.ToString()">
#foreach (var item in Model.ListAdvertIndividual)
{
int itemBannerHeight = Model.ListAdvertIndividual.Count() > 1 && string.IsNullOrWhiteSpace(item.LabelTitle) ? Model.AdvertGroup.GroupImgWithLableHeight : Model.AdvertGroup.GroupBannerHeight;
if (item.AdvertIndividualId > 0 && !string.IsNullOrWhiteSpace(item.SeoFilename)) //--#0012794
{
<div class="item" style="margin-left:7px;margin-right:7px;margin-top:5px;margin-bottom:15px;">
<div class="inner-item" style="height:#(Model.AdvertGroup.GroupImgWithLableHeight)px;width:#(Model.AdvertGroup.GroupBannerWidth);max-width:100%;margin-top:20px;">
<img class="d-block w-100" src="#(item.SeoFilename)" alt="First slide" style="width:#(Model.AdvertGroup.GroupBannerWidth);height:#(itemBannerHeight)px;max-width:100%;">
</div>
</div>
}
}
JQUERY::>> (we need below function to call on document.ready)
function bannerAdWidgetSetCarousal() {
$('.clsBannerAds').each(function (index, element) {
var columnCount = $(this).attr('data-columncount') || 1;
var columnCntDesktopSmall = columnCount > 2 ? columnCount - 1 : columnCount;
var columnCntTablet = columnCntDesktopSmall > 2 ? columnCntDesktopSmall - 1 : 1;
var playInterval = $(this).attr('data-autoplayinterval') || false;
var rowCount = $(this).attr('data-rowcount');
var displayMode = $(this).attr('data-displaymode');
var isDynamicDisplayMode = displayMode && displayMode == "Dynamic" ? true : false;
var makeAnimate = isDynamicDisplayMode;
var showNavigationArrow = !isDynamicDisplayMode ? true : false;
var arrNavText = !isDynamicDisplayMode ? ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"] : ["", ""];
var slideItems = $(element).find('.item');
//THIS is code for make carosal slide in horizontal row, based on row count [ex. slides in 1 row, 2 row, 3 row]
if (rowCount && rowCount > 1 && slideItems.length > 1) {
var loopCount = Math.ceil(slideItems.length / rowCount);
for (var i = 0; i < loopCount; i++) {
var $el = $(element).find('.item:nth-of-type(' + (i + 1) + ')');
if ($el.next().length == 0) break;
$el.next().find('.inner-item').appendTo($el);
$el.next().remove();
}
}
//Init owlCarousel
$(element).owlCarousel({
items: columnCount,
lazyLoad: true,
loop: true,
autoPlay: playInterval,
pagination: false,
itemsDesktop: [1199, columnCount],
itemsDesktopSmall: [979, columnCntDesktopSmall],
itemsTablet: [768, columnCntTablet],
itemsMobile: [479, 1],
navigation: showNavigationArrow,
navigationText: arrNavText,
singleItem: makeAnimate,
transitionStyle: "goDown"
});
});
}
I am having an error when trying to sort doing a findAll:
"Sort key dateis not one of the valid strings."
My options are the following (I tried different formats for desc, everyone was throwing the same 'error'):
var options = {sort: [{"date": "desc"}]};
Everything seems fine, the JSONStore works as expected, sorting the returned data, I just want to be sure that the 'error' is indeed a bug or mistake on the worklight.js part and not that I am doing something wrong.
This is the function that checks for a valid sortObj in worklight.js:
/** Checks if sortObj is a valid sort object for a query
* #private
*/
var __isValidSortObject = function(sortObj, searchFields, additionalSearchFields) {
var propertiesValidated = 0,
sortObjKey, sortStr;
for (sortObjKey in sortObj) {
if (sortObj.hasOwnProperty(sortObjKey)) {
if (propertiesValidated > 0) {
WL.Logger.trace('Sort object ' + JSON.stringify(sortObj) + ' has more than one property. Each object must have only one property.');
return false;
}
//check is sortObjKey is lowerCase
if (_.isUndefined(searchFields[sortObjKey.toLowerCase()]) && _.isUndefined(additionalSearchFields[sortObjKey.toLowerCase()])) {
WL.Logger.trace('Sort key ' + sortObjKey + ' is not part of search fields: ' + JSON.stringify(searchFields) + ' or additional search fields: ' + JSON.stringify(additionalSearchFields));
return false;
}
sortStr = sortObj[sortObjKey];
//Check that the string that specifies sorting order says either "asc" or "desc"
**if (__isString(sortStr) && sortStr.length > 0 && (/^(a|de)sc$/i.test(sortStr))) {
WL.Logger.trace('Sort key ' + sortObjKey + 'is not one of the valid strings.');
propertiesValidated++;
} else {
// Here seems to be the problem, shouldn't the trace be before return false?
return false;
}**
}
}
if (propertiesValidated === 0) {
return false;
}
return true;
};
You can clearly see that they do the WL.Logger.trace when the check is fine and that it should be just before return false.
Does anyone that has used sort on a JSONStore receives this trace as well?.
Platform version: 7.1.0.00.20160129-1923
I contacted IBM support and they indeed confirmed that it is a bug that will be solved in the next build.
Hello I a little problem with my paginator, i would like to use some custom SQL Request but each time i click on a paginator link it loads my model without the custom request
I enter informations on a form that I send by GET method:
$view->grid->js()->reload(array("From" =>
$form->get("From"),"To" => $form->get("To"),"SSID" => $form->get("SSID")))
->execute();
On my view I have :
$this->request=$this->api->db->dsql();
$this->grid=$this->add('Grid');
$this->grid->setModel('Systemevents',array('ID','ReceivedAt','Message'));
$this->grid->addPaginator(10);
if (isset($_GET["SSID"])) {
$this->ssid = $_GET["SSID"];
}
if (isset($_GET["From"])) {
$this->from = $_GET["From"];
}
if (isset($_GET["To"])) {
$this->to = $_GET["To"];
}
$this->grid->dq->where($this->requette->expr('Message like "%.% '
. $this->ssid . ' % src=%"'))
->where($this->requette->expr("ReceivedAt >= '".$this->from. "'
AND ReceivedAt <= '".$this->to."'"));
The problem is that the where condition disapear when i change the page with the paginator.
I did not found any solution to my problem so I have done something differently
I added two buttons to my grid wich allows me to change the limit of the sql request.
The previous button is hidden if the limit is 0.
Now i have to found how to count the number of lines (select count('ID') from 'SystemEvents' where....) and to stock it in a variable.
Finally the ultimate solution was to do :
if ((isset($_GET["SSID"])) || (isset($_GET["From"])) || (isset($_GET["To"]))) {
//GET Method from Recherche.php
$this->ssid = ($_GET["SSID"] == "null" ? null : $_GET["SSID"]);
$this->api->stickyGET("SSID"); // the solutiuon is here
$this->from = ($_GET["From"] == "null" ? null : $_GET["From"]);
$this->api->stickyGET("From"); // <===== the solutiuon is here
$this->to = ($_GET["To"] == "null" ? null : $_GET["To"]);
$this->api->stickyGET("To"); // <===== the solutiuon is here
}