How to handle dblClick event on Fullcalendar daySlot? - fullcalendar

I know its possible to receive a dayClick event on Fullcalendar. But I would like to manage just the double click event. Is this possible?

There is a manageable way to handle double clicks in the FullCalendar dayClick event.
The "300" is really just an arbitrary amount of time in milliseconds to determine whether or not the clicks are close enough to call them a double click. If you want them faster or slower you can shrink or increase the number accordingly.
var this_click_time = new Date().getTime();
var time_since_last_click = this_click_time - last_click_time;
last_click_time = this_click_time;
if(time_since_last_click < 300)
{
// Double Click = true;
}

currently not possible, will be possible when dayRender is developed. Alternately, you could look at this person's patch but can't say how far you'd get with it.

Related

How to handle buttonclicked event of DDDW?

Situation:
I have a button in my DDDW and i want to capture buttonclicked event.
Problem:
when i click on the button in DDDW the buttonclicked event of DW Control is not fired and ItemChanged event is fired for DW control.
Question:
How do i capture buttonclicked event for the button in DDDW? Or is there any other way i can delete a row from DDDW when delete button is clicked for a particular row?
PowerBuilder 12.5
According to the PB help, a DataWindowChild has no events :|
But, that doesn't mean we still can't hook into it via the DW control's itemchanged event. Note: this is a hack, and underwent some very-limited testing. But, it demonstrates a point, I guess.
Here's what I did:
Created a DataWindow with the code and name columns, and a computed field (for the red X) named delete_button
Created another DataWindow and painted that DW as a DDDW on there, named profession
In my window control's open event, I got the DDDW from the DW and stuck it in an instance variable:
dw_1.GetChild("profession", REF idwc_profession)
Then, coded the itemchanged event for the DW control:
// dw_1::itemchanged
//
// - DDDW is named "profession"
IF dwo.Name = "profession" THEN
IF IsValid(idwc_profession) THEN
string ls_clickedobject
// Get the DataWindowCHILD object where the pointer was clicked:
ls_clickedobject = idwc_profession.GetObjectAtPointer()
IF IsNull(ls_clickedObject) OR (ls_clickedobject = "") THEN RETURN
// Return from GetChild is <column name>~t<row number>; let's get
// the position of the tab character so we can parse it
long ll_tabPos
ll_tabPos = Pos(ls_clickedObject, "~t")
IF ll_tabPos > 0 THEN
string ls_clickedDddwColumn
ls_clickedDddwColumn = Trim(Left(ls_clickedObject, ll_tabPos - 1))
// Check to see if we've clicked on the computed field with the delete button
IF Lower(ls_clickedDddwColumn) = "delete_button" THEN
long ll_clickedDddwRow
// grab the row we want to delete
ll_clickedDddwRow = Long(Trim(Right(ls_clickedObject, Len(ls_clickedObject) - ll_tabPos)))
IF ll_clickedDddwRow > 0 THEN
// delete the row from the DDDW
idwc_profession.DeleteRow(ll_clickedDddwRow)
SetNull(data) // reset our data
END IF
END IF
END IF
END IF
END IF
RETURN
Also note that you may have to play around with the return value from itemchanged to get it to do what you want. And, if you want to automatically dropdown the DDDW again after the deletion happens, you'd might be able to use the Send() method to do so (I don't know the right "number" for that, though).

I need to change the fullcalendar header as each month is selected

I need to change the header as each month is selected. This includes text from a database so we are talking about ajax, which I am familiar with. I just need to know the event that is triggered on a month change and also capture the month/year that is being loaded.
The eventAfterAllRender callback option is your best bet. http://fullcalendar.io/docs/event_rendering/eventAfterAllRender/
Here's a little demo: http://jsfiddle.net/slicedtoad/jk9u53h6/1/
When all the events are finished rendering (which happens anytime the month, day or week is changed) it convert the current date into a string and replace the title text with it.
var dateChanged = function(){
var currentDate = $("#calendar").fullCalendar('getDate');
console.log(currentDate);
$('.fc-toolbar .fc-left h2').text(currentDate.format());
}
var $fc = $("#calendar").fullCalendar({
eventAfterAllRender: dateChanged,
});
Not super solid, but you should be able to make it fit your needs.

Select multiple time slots on click

When I click on a empty time slot on fullCalendar, it draws a rectangle on that empty cell. So, If my slotDuration is 30min, the block represents 30 min. I also can drag the cursor over multiple cells and select a custom range. But what I need to do is, when the user click (not drag) on a cell, select and draw the rectangle on 2 cells (representing 1 hour). Is this possible? I cannot change the slotDuration.
If I change the snapDuration to 1 hour, it works, but sadly, I cannot change it also.
What I was looking for is a way to override the event.end but that did not work.
Update 1:
I was able to do this exposing the cellDuration property:
on fullCalendar.js:
t.setCellDuration = function (minutes) {
var duration = moment.duration(minutes, 'minutes');
var view = t.getView();
view.timeGrid.cellDuration = duration;
}
now on the renderEvent handler, I can call
element.fullCalendar("setCellDuration", 60);
It works but if there is an alternative that does not involve change fullCalendar code, it would be nice.
I think you cannot do it just modifying the properties of the calendar, but you could do it modifying the fullCalendar.js file. Yes, I know you specify it on your question, but I think there is not alternative.
Exactly the listenStop function, which resides at line 4527 at version 2.3.3
listenStop check an array call dates
dates[
{FCMoment}, //start
{FCMoment} //end
]
So, before that check, you can modify your end time as you prefer. In addition, you have to render it.
In your code, now listenStop() function should be something like:
listenStop: function(ev) {
if (dates) { // started and ended on a cell?
if (dates[0].isSame(dates[1])) {
dates[1] = dates[0].clone().add(1, 'hours'); //Now we modify the end
_this.renderSelection(dates[0], dates[1]); //And render the modified selection
view.trigger('dayClick', dayEl[0], start, ev);
}
if (isSelectable) {
// the selection will already have been rendered. just report it
view.reportSelection(start, end, ev);
}
}
}

listening for viewstack change event

I have a piece of software I'm working on that is using a viewstack with 3 canvases. With the change event I need to look for index 2 which is the last canvas when it changes to this canvas I need it to grab data from inputs from the previous two canvases.
Within the viewstack events I've assigned the function change() to the event childIndexChange.
Here is the method:
private function change():void
{
Alert.show(customerViewStack.selectedIndex.toString());
}
eventually this method will look something like this:
public function change():void
{
if(customerViewStack.selectedIndex == 2)
{
rCID.text = cidTxt.text;
rCNAME.text = nameTxt.text;
rCACCTN.text = acctNumTxt.text;
rCACCTR.text = acctRep.text;
rCWEB.text = website.text;
rCACTIVE.text = active.text;
rCSTREET.text = cStreet.text + " "+ cSuite.text;
rCCSZ.text = cCity.text + ", " + cState.text + " " + cZipcode.text;
rCPHN.text = cPhone.text;
rCAPHN.text = cPhone0.text;
rCFAX.text = cFax.text;
}
}
to alternate through my views im using this approach with buttons actually inside the canvases:
customerViewStack.selectedChild=cAddress
anyway the problem is the event doesn't seem to be firing my change function because no alert is coming up also the way I'm doing this is probably quite naive so if you have any suggestions please I'm open.
I've taken another approach I'm going to bypass "deferred instantiation" and turn the cereationPolicy to all. The view before the last I will set values from there then transition over.
However if anyone has any thoughts or criticism please feel free.
The change event will fire when the view is changed, so simply subscribing to this event instead of childIndexChange should solve the problem.

I want to add items to an ASP.Net combobox using Javascript

I want to add an item to an ASP.Net combobox using Javascript. I can retrieve the ID (No Masterpage). How can I add values to the combobox from Javascript? My present code looks like this.
//Fill the years (counting 100 from the first)
function fillvarYear() {
var dt = $('#txtBDate').val();
dt = dt.toString().substring(6);
var ye = parseInt(dt);
//Loop and add the next 100 years from the birth year to the combo
for (var j = 1; j <= 100; j++) {
ye += 1; //Add one year to the year count
var opt = document.createElement("OPTION");
opt.text = ye;
opt.value = ye;
document.form1.ddlYear.add(opt);
}
}
To see the value on postback:
string selectedValue = Request.Params[combobox.UniqueId]
Remember, changing the values in a combobox with javascript will cause an Event Validation exception to be thrown, and is generally a bad idea, as you'll have to explicitly disabled event validation.
I'd recommend placing the combobox in an update panel, so you can read txtBirthDate on the server and generate the appropriate data. You then won't have to manually preserve state either.
Always remember, ASP.NET controls are nothing "fancy" - they always end up at some point becoming standard HTML elements.
Try checking out this site. It has a pretty nice demo and overview. Take note however that you are altering the data at the client side - this means you will need to do it on each and every request because the ViewState will not be updated.
TBH, you are probably better off just using a HTML control rather than ASP ComboBox..
Can I ask why you are changing items via Javascript? (out of curiosity) :)
I found a possible solution. I don't know why the earlier code didn't work for me, but the line below
document.form1.ddlYear.appendChild(new Option(ye, ye));

Resources