We Keep Coding

How can I make daterangepicker dates into a drop down menu?

I am using a tour booking theme. I do not want the dates in the theme reservation calendar to be opened in the form of a calendar and I want to remove the passive dates that appear on the calendar. How should I code for this. Can you help me?
I want to do:I want to do:
on my site:on my site:
calendar plugin:calendar plugin:
(function ($) {
new Vue({
el:'#bravo_tour_book_app',
data:{
id:'',
extra_price:[],
person_types:[],
message:{
content:'',
type:false
},
html:'',
onSubmit:false,
start_date:'',
start_date_html:'',
step:1,
guests:1,
price:0,
max_guests:1,
start_date_obj:'',
duration:0,
allEvents:[],
buyer_fees:[],
},
watch:{
extra_price:{
handler:function f() {
this.step = 1;
},
deep:true
},
start_date(){
this.step = 1;
},
guests(){
this.step = 1;
},
person_types:{
handler:function f() {
this.step = 1;
},
deep:true
},
},
computed:{
total_price:function(){
var me = this;
if (me.start_date !== "") {
var total = 0;
var total_guests = 0;
var startDate = new Date(me.start_date).getTime();
for (var ix in me.allEvents) {
var item = me.allEvents[ix];
var cur_date = new Date(item.start).getTime();
if (cur_date === startDate) {
if (item.person_types != null) {
me.person_types = Object.assign([], item.person_types);
} else {
me.person_types = null
}
me.max_guests = parseInt(item.max_guests);
me.price = parseFloat(item.price);
}
}
// for person types
if (me.person_types != null) {
for (var ix in me.person_types) {
var person_type = me.person_types[ix];
total += parseFloat(person_type.price) * parseInt(person_type.number);
total_guests += parseInt(person_type.number);
}
}else{
// for default
total_guests = me.guests;
total += me.guests * me.price;
}
for (var ix in me.extra_price) {
var item = me.extra_price[ix];
var type_total = 0;
if (item.enable === true) {
switch (item.type) {
case "one_time":
type_total += parseFloat(item.price);
break;
case "per_hour":
if (me.duration > 0) {
type_total += parseFloat(item.price) * parseFloat(me.duration);
}
break;
case "per_day":
if (me.duration > 0) {
type_total += parseFloat(item.price) * Math.ceil(parseFloat(me.duration) / 24);
}
break;
}
if (typeof item.per_person !== "undefined") {
type_total = type_total * total_guests;
}
total += type_total;
}
}
for (var ix in me.buyer_fees) {
var item = me.buyer_fees[ix];
var type_total = 0;
type_total += parseFloat(item.price);
if (typeof item.per_person !== "undefined") {
type_total = type_total * total_guests;
}
total += type_total;
}
return total;
}
return 0;
},
total_price_html:function(){
if(!this.total_price) return '';
return window.bravo_format_money(this.total_price);
},
daysOfWeekDisabled(){
var res = [];
for(var k in this.open_hours)
{
if(typeof this.open_hours[k].enable == 'undefined' || this.open_hours[k].enable !=1 ){
if(k == 7){
res.push(0);
}else{
res.push(k);
}
}
}
return res;
}
},
created:function(){
for(var k in bravo_booking_data){
this[k] = bravo_booking_data[k];
}
},
mounted(){
var me = this;
/*$(".bravo_tour_book").sticky({
topSpacing:30,
bottomSpacing:$(document).height() - $('.end_tour_sticky').offset().top + 40
});*/
var options = {
singleDatePicker: true,
showCalendar: false,
sameDate: true,
autoApply : true,
disabledPast : true,
dateFormat : bookingCore.date_format,
enableLoading : true,
showEventTooltip : true,
classNotAvailable : ['disabled', 'off'],
disableHightLight: true,
minDate:this.minDate,
opens:'left',
isInvalidDate:function (date) {
for(var k = 0 ; k < me.allEvents.length ; k++){
var item = me.allEvents[k];
if(item.start == date.format('YYYY-MM-DD')){
return item.active ? false : true;
}
}
return false;
}
};
if (typeof daterangepickerLocale == 'object') {
options.locale = _.merge(daterangepickerLocale,options.locale);
}
this.$nextTick(function () {
$(this.$refs.start_date).daterangepicker(options).on('apply.daterangepicker',
function (ev, picker) {
me.start_date = picker.startDate.format('YYYY-MM-DD');
me.start_date_html = picker.startDate.format(bookingCore.date_format);
})
.on('update-calendar',function (e,obj) {
me.fetchEvents(obj.leftCalendar.calendar[0][0], obj.leftCalendar.calendar[5][6])
});
});
},
methods:{
handleTotalPrice: function () {
},
fetchEvents(start,end){
var me = this;
var data = {
start: start.format('YYYY-MM-DD'),
end: end.format('YYYY-MM-DD'),
id:bravo_booking_data.id,
for_single:1
};
console.log(data);
$.ajax({
url: bravo_booking_i18n.load_dates_url,
dataType:"json",
type:'get',
data:data,
beforeSend: function() {
$('.daterangepicker').addClass("loading");
},
success:function (json) {
me.allEvents = json;
var drp = $(me.$refs.start_date).data('daterangepicker');
drp.allEvents = json;
drp.renderCalendar('left');
if (!drp.singleDatePicker) {
drp.renderCalendar('right');
}
$('.daterangepicker').removeClass("loading");
},
error:function (e) {
console.log(e);
console.log("Can not get availability");
}
});
},
formatMoney: function (m) {
return window.bravo_format_money(m);
},
validate(){
if(!this.start_date)
{
this.message.status = false;
this.message.content = bravo_booking_i18n.no_date_select;
return false;
}
return true;
},

If what you would like to use is simply a drop down list, why don't you create a simple one as follows?
<select name="availableDates">
<option value="0">Select a date</option>
<?php
//get the available dates from your database (or whatever source)
$getDates = $connection->prepare("select Date from availableDatesTable where hotelID=?");
$getDates->bind_param('i',$hotelID); //you could get the hotel ID via a $_GET variable
//store the results into an array
//loop through the array as follows:
foreach($resultArray as $res)
{
echo '<option value="'.$res.'">'.date('d F Y',$res).'</option>';
}
?>
</select>
Not sure what data source you are using, but this is a suggestion that could hopefully lead to the solution you're seeking.

Boolean for each question with array list

one var with multiples "selected" question relates to "employee".
When open the system will show up all question, whatever I pressed the button will show me an employee and I will select one (ex: Brian for the first question) and will select "positive".
When I click on my second question, Brian is already selected. HERE is my problem.
Should be select only in one question and is making flag for all question.
anything wrong with the boolean?
var resultHandler = function(){
currentQuestion = this;
$('#details-name').text(currentQuestion.question);
$('#projectPopUp').show();
};
var cancel = function() {
//do nothing for now
}
var commenthandler = function() {
var value = $("#" + this.id + "-comment").val();
this.comments = value;
$("#" + this.id + "-comment").val(value);
};
var names = [];
// bt select ppl
var nameList = function (){
for (var i = 0; i < employees.length; i++) {
var name = employees[i];
var id = i;
var data = {
id: 'e' +id,
name: name
};
names.push(data);
$('#detailsgrid tbody').append(Utils.processTemplate("#popupPersonTemplate tbody", data));
$("#" + data.id + "-status").text('Select');
$("#" + data.id + "-status").click(statusHandler.bind(data));
}
};
var statusHandler = function(){
var previousResult = this.inspectionResult;
var answerIndex = answers.indexOf(previousResult);
/** -1 is if the answer is not found if not found defaults to first answer
* else it gets the next answer
*/
console.log('Answer Index: ' + answerIndex);
if (answerIndex == -1) {
console.log('Answer index is -1');
answerIndex = 0;
this.active = 'false';
updateActiveStatus(this);
} else {
answerIndex = (answerIndex + 1) % answers.length;
}
var currentResult = answers[answerIndex];
this.inspectionResult = currentResult;
$("#" + this.id + "-status").text(currentResult);
// commentvisibilitymanager(this);
};
var buildQuestionnaire = function(){
parseInitialDataHolder();
for (var i = 0; i < ARRAY_OF_QUESTIONS.length; i++){
var id = ARRAY_OF_QUESTIONS[i].code;
if (id && typeof id != 'undefined'){
id = id.replace('.', '-');
};
var data = {
id: id,
question: ARRAY_OF_QUESTIONS[i].question,
inspectionResult: "", //defaultResults
employee_results: [],
active: true
};
var initialdata = initialdataholder[id];
if(initialdata) {
data = initialdata;
}
dataholder.push(data);
if (typeof ARRAY_OF_QUESTIONS[i].header == 'undefined') {
$('#questionsTable tbody').append(Utils.processTemplate("#rowTemplate tbody", data));
$("#" + id + "-inspectionResult").text(data.inspectionResult || 'Select');
$("#" + id + "-inspectionResult").click(resultHandler.bind(data));
updateActiveStatus(data);
commentvisibilitymanager(data);
}
else {
$('#questionsTable tbody').append(Utils.processTemplate("#sectionRowTemplate tbody", data));
}
}
}
//to close the popup
var closePopup = function() {
$('#projectPopUp').hide();
};
$(document).ready(function() {
buildQuestionnaire();
nameList();
});

Unreachable code in varien/configurable.js Magento

I was taking a look at the Magento source file to try to understand why I can't move varien/configurable.js whithout throwing an error with another extension, so Google Closure Compiler to shrink it, but it returns an error at line 267:
JSC_UNREACHABLE_CODE: unreachable code at line 267 character 8
if($('product-price-'+this.config.productId)){ ^
In particular these is the slice of code:
getAttributeOptions: function(attributeId){
if(this.config.attributes[attributeId]){
return this.config.attributes[attributeId].options;
}
},
Could someone explain me why it throw out that warning?
This is the whole code:
/**
* Magento
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE_AFL.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license#magentocommerce.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade Magento to newer
* versions in the future. If you wish to customize Magento for your
* needs please refer to http://www.magentocommerce.com for more information.
*
* #category Varien
* #package js
* #copyright Copyright (c) 2014 Magento Inc. (http://www.magentocommerce.com)
* #license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0)
*/
if (typeof Product == 'undefined') {
var Product = {};
}
/**************************** CONFIGURABLE PRODUCT **************************/
Product.Config = Class.create();
Product.Config.prototype = {
initialize: function(config){
this.config = config;
this.taxConfig = this.config.taxConfig;
if (config.containerId) {
this.settings = $$('#' + config.containerId + ' ' + '.super-attribute-select');
} else {
this.settings = $$('.super-attribute-select');
}
this.state = new Hash();
this.priceTemplate = new Template(this.config.template);
this.prices = config.prices;
// Set default values from config
if (config.defaultValues) {
this.values = config.defaultValues;
}
// Overwrite defaults by url
var separatorIndex = window.location.href.indexOf('#');
if (separatorIndex != -1) {
var paramsStr = window.location.href.substr(separatorIndex+1);
var urlValues = paramsStr.toQueryParams();
if (!this.values) {
this.values = {};
}
for (var i in urlValues) {
this.values[i] = urlValues[i];
}
}
// Overwrite defaults by inputs values if needed
if (config.inputsInitialized) {
this.values = {};
this.settings.each(function(element) {
if (element.value) {
var attributeId = element.id.replace(/[a-z]*/, '');
this.values[attributeId] = element.value;
}
}.bind(this));
}
// Put events to check select reloads
this.settings.each(function(element){
Event.observe(element, 'change', this.configure.bind(this))
}.bind(this));
// fill state
this.settings.each(function(element){
var attributeId = element.id.replace(/[a-z]*/, '');
if(attributeId && this.config.attributes[attributeId]) {
element.config = this.config.attributes[attributeId];
element.attributeId = attributeId;
this.state[attributeId] = false;
}
}.bind(this))
// Init settings dropdown
var childSettings = [];
for(var i=this.settings.length-1;i>=0;i--){
var prevSetting = this.settings[i-1] ? this.settings[i-1] : false;
var nextSetting = this.settings[i+1] ? this.settings[i+1] : false;
if (i == 0){
this.fillSelect(this.settings[i])
} else {
this.settings[i].disabled = true;
}
$(this.settings[i]).childSettings = childSettings.clone();
$(this.settings[i]).prevSetting = prevSetting;
$(this.settings[i]).nextSetting = nextSetting;
childSettings.push(this.settings[i]);
}
// Set values to inputs
this.configureForValues();
document.observe("dom:loaded", this.configureForValues.bind(this));
},
configureForValues: function () {
if (this.values) {
this.settings.each(function(element){
var attributeId = element.attributeId;
element.value = (typeof(this.values[attributeId]) == 'undefined')? '' : this.values[attributeId];
this.configureElement(element);
}.bind(this));
}
},
configure: function(event){
var element = Event.element(event);
this.configureElement(element);
},
configureElement : function(element) {
this.reloadOptionLabels(element);
if(element.value){
this.state[element.config.id] = element.value;
if(element.nextSetting){
element.nextSetting.disabled = false;
this.fillSelect(element.nextSetting);
this.resetChildren(element.nextSetting);
}
}
else {
this.resetChildren(element);
}
this.reloadPrice();
},
reloadOptionLabels: function(element){
var selectedPrice;
if(element.options[element.selectedIndex].config && !this.config.stablePrices){
selectedPrice = parseFloat(element.options[element.selectedIndex].config.price)
}
else{
selectedPrice = 0;
}
for(var i=0;i<element.options.length;i++){
if(element.options[i].config){
element.options[i].text = this.getOptionLabel(element.options[i].config, element.options[i].config.price-selectedPrice);
}
}
},
resetChildren : function(element){
if(element.childSettings) {
for(var i=0;i<element.childSettings.length;i++){
element.childSettings[i].selectedIndex = 0;
element.childSettings[i].disabled = true;
if(element.config){
this.state[element.config.id] = false;
}
}
}
},
fillSelect: function(element){
var attributeId = element.id.replace(/[a-z]*/, '');
var options = this.getAttributeOptions(attributeId);
this.clearSelect(element);
element.options[0] = new Option('', '');
element.options[0].innerHTML = this.config.chooseText;
var prevConfig = false;
if(element.prevSetting){
prevConfig = element.prevSetting.options[element.prevSetting.selectedIndex];
}
if(options) {
var index = 1;
for(var i=0;i<options.length;i++){
var allowedProducts = [];
if(prevConfig) {
for(var j=0;j<options[i].products.length;j++){
if(prevConfig.config.allowedProducts
&& prevConfig.config.allowedProducts.indexOf(options[i].products[j])>-1){
allowedProducts.push(options[i].products[j]);
}
}
} else {
allowedProducts = options[i].products.clone();
}
if(allowedProducts.size()>0){
options[i].allowedProducts = allowedProducts;
element.options[index] = new Option(this.getOptionLabel(options[i], options[i].price), options[i].id);
if (typeof options[i].price != 'undefined') {
element.options[index].setAttribute('price', options[i].price);
}
element.options[index].config = options[i];
index++;
}
}
}
},
getOptionLabel: function(option, price){
var price = parseFloat(price);
if (this.taxConfig.includeTax) {
var tax = price / (100 + this.taxConfig.defaultTax) * this.taxConfig.defaultTax;
var excl = price - tax;
var incl = excl*(1+(this.taxConfig.currentTax/100));
} else {
var tax = price * (this.taxConfig.currentTax / 100);
var excl = price;
var incl = excl + tax;
}
if (this.taxConfig.showIncludeTax || this.taxConfig.showBothPrices) {
price = incl;
} else {
price = excl;
}
var str = option.label;
if(price){
if (this.taxConfig.showBothPrices) {
str+= ' ' + this.formatPrice(excl, true) + ' (' + this.formatPrice(price, true) + ' ' + this.taxConfig.inclTaxTitle + ')';
} else {
str+= ' ' + this.formatPrice(price, true);
}
}
return str;
},
formatPrice: function(price, showSign){
var str = '';
price = parseFloat(price);
if(showSign){
if(price<0){
str+= '-';
price = -price;
}
else{
str+= '+';
}
}
var roundedPrice = (Math.round(price*100)/100).toString();
if (this.prices && this.prices[roundedPrice]) {
str+= this.prices[roundedPrice];
}
else {
str+= this.priceTemplate.evaluate({price:price.toFixed(2)});
}
return str;
},
clearSelect: function(element){
for(var i=element.options.length-1;i>=0;i--){
element.remove(i);
}
},
getAttributeOptions: function(attributeId){
if(this.config.attributes[attributeId]){
return this.config.attributes[attributeId].options;
}
},
reloadPrice: function(){
if (this.config.disablePriceReload) {
return;
}
var price = 0;
var oldPrice = 0;
for(var i=this.settings.length-1;i>=0;i--){
var selected = this.settings[i].options[this.settings[i].selectedIndex];
if(selected.config){
price += parseFloat(selected.config.price);
oldPrice += parseFloat(selected.config.oldPrice);
}
}
optionsPrice.changePrice('config', {'price': price, 'oldPrice': oldPrice});
optionsPrice.reload();
return price;
if($('product-price-'+this.config.productId)){
$('product-price-'+this.config.productId).innerHTML = price;
}
this.reloadOldPrice();
},
reloadOldPrice: function(){
if (this.config.disablePriceReload) {
return;
}
if ($('old-price-'+this.config.productId)) {
var price = parseFloat(this.config.oldPrice);
for(var i=this.settings.length-1;i>=0;i--){
var selected = this.settings[i].options[this.settings[i].selectedIndex];
if(selected.config){
price+= parseFloat(selected.config.price);
}
}
if (price < 0)
price = 0;
price = this.formatPrice(price);
if($('old-price-'+this.config.productId)){
$('old-price-'+this.config.productId).innerHTML = price;
}
}
}
}

Please check the below code in reloadOldPrice function:
return price;
if($('product-price-'+this.config.productId)){
$('product-price-'+this.config.productId).innerHTML = price;
}
this.reloadOldPrice();
when you are using return price; the return statement doesn't allow next code to run. So its unreachable, hence garbage.
Either use some condition if you want the function to stop there in specific situations or put that return statement at the end of function or simply remove return price; if its not required.

SetSelectedRange Spread.NET javascript issue

I'm trying to add functionality to Spread.NET control where it will permit a hold shift-click to select a range of cells in ASP.
I'm creating the event onActiveCellChanged to call the selectRange function on execution
var shiftPressed = false;
var newSelect = true;
window.pageLoad = function init() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
if (ss.addEventListener != null) {
ss.addEventListener("ActiveCellChanged", selectRange(), false);
} else if (ss.attachEvent != null) {
ss.attachEvent("ActiveCellChanged", selectRange());
}
else {
FpSpread1.onActiveCellChanged = selectRange;
}
}
Here is the selectRange function.
function selectRange() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
var swap;
if (shiftPressed == true) {
var initRow = document.getElementById('RowCoord').value;
var initCol = document.getElementById('ColCoord').value;
var SecRow = getRow();
var SecCol = getCol();
newSelect = false;
var rCount = Math.abs(SecRow - initRow) + 1;
var cCount = Math.abs(SecCol - initCol) + 1;
if (initRow > SecRow)
initRow = SecRow;
if (initCol > SecCol)
initCol = SecCol;
//alert(initRow + ' ' + initCol);
alert(initRow + ' ' + initCol + ' ' + rCount + ' ' + cCount);
ss.SetSelectedRange(initRow, initCol, rCount, cCount);
}
else {
document.getElementById('RowCoord').value = 0;
document.getElementById('ColCoord').value = 0;
newSelect = true;
}
}
And this is how I'm determining whether shift is being held.
function aKeyDown(event) {
if (event.keyCode == 16) {
shiftPressed = true;
var col = getCol();
var row = getRow();
if (newSelect) {
document.getElementById('RowCoord').value = row;
document.getElementById('ColCoord').value = col;
}
}
}
function aKeyUp(event) {
if (event.keyCode == 16) {
shiftPressed = false;
}
}
function getRow() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
ret = ss.ActiveRow;
if (ret == undefined)
ret = ss.GetActiveRow;
return ret;
}
function getCol() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
ret = ss.ActiveCol;
if (ret == undefined)
ret = ss.GetActiveCol;
return ret;
}
The SetSelectedRange in the select range function will work if my initial cell is a,1. However, if it's any other cell, it'll select the entire row and column.
Here is my <div> tag:
<FarPoint:FpSpread onkeydown="aKeyDown(event)" onkeyup="aKeyUp(event)" ID="FpSpread1"...
In image 1, My initial cell was (a,3) and I held shift and clicked on (b,4)
In image 2, it works. As long as I start at cell (a,1)

I needed to parseInt the row and column values.
function getRow() {
var ss = document.getElementById(spd);
ret = ss.ActiveRow;
if (ret == undefined)
ret = ss.GetActiveRow();
return parseInt(ret);
}
function getCol() {
var ss = document.getElementById(spd);
ret = ss.ActiveCol;
if (ret == undefined)
ret = ss.GetActiveCol();
return parseInt(ret);
}

Dynamic checkbox name to assign its value

what is wrong with this code I get an undefined error. my checkbox is not an array on front end it uses different names and I want user to select only one checkbox:
function select_item(index){
var choice_options = [];
choice_options['S'] = 'item_cb_S';
choice_options['T'] = 'item_cb_T';
choice_options['Z'] = 'item_cb_Z';
choice_options['D'] = 'item_cb_D';
choice_options['N'] = 'item_cb_N';
for (i in choice_options) {
var vl = choice_options[i];
if(vl.substring(8) == index) {
document.wizardform.choice_options[index].checked = true;
//alert("true");
}
else {
document.wizardform.vl.checked = false;
}
}
return true;
}

It's not so pretty but you could use eval......
function select_item(index){
var choice_options = [];
choice_options['S'] = 'item_cb_S';
choice_options['T'] = 'item_cb_T';
choice_options['Z'] = 'item_cb_Z';
choice_options['D'] = 'item_cb_D';
choice_options['N'] = 'item_cb_N';
for (i in choice_options) {
var vl = choice_options[i];
if(vl.substring(8) == index) {
eval("document.wizardform." + choice_options[index] + ".checked = true;");
//alert("true");
}
else {
document.wizardform.vl.checked = false;
}
}
return true;
}