how I can run eventClick function defined in fullcalendar in my function called. When I call:
$('#kalendar').fullCalendar.trigger('eventClick', eventID);
browser return typeerror, that trigger is not function. How I trigger mouse click on specific event or call eventClick on specific event to run eventClick, where is programmed edit dialogue?
Thanks for help.
Fullcalendar provides eventClick function in it's configuration as below.
$('#kalendar').fullCalendar({
eventClick: function(calEvent, jsEvent, view) {
alert('Event: ' + calEvent.title);
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
alert('View: ' + view.name);
// change the border color just for fun
$(this).css('border-color', 'red');
}
});
OK, I solve my question...
add event id to DIV.fc-content - a tag, which will be better, but
it can't access on this time, is maybe created after event render?
eventRender: function(event, element, calEvent){
var icon = $('<div />');
icon.css('width',"12px");
icon.css('height',"12px");
icon.css('margin',"2px 3px 0 0");
icon.css('display',"inline-block");
icon.css('vertical-align',"text-top");
if(event.status == "CONFIRMED")
icon.css('background-image',"url(images/ico_accept12w.png)");
else
icon.css('background-image',"url(images/ico_help12w.png)");
element.find('.fc-content').attr("id", "event-"+ event.id); // add event id
element.find('.fc-title').prepend(icon);
},
my function to call click event:
it's called click trigger on parent a tag on DIV.fc-content
function zobrazUdalost(id, datum)
{
$('#kalendar<%= idKalendare %>').fullCalendar('gotoDate', moment(datum)); // to go event day
var events = $('#kalendar<%= idKalendare %>').fullCalendar('clientEvents', id);
if(events.length > 0){
$("#event-"+ id).parents("a.fc-day-grid-event").trigger("click"); // call click trigger
}
}
Related
To change the color of the calendar after processing.
Instead of changing the color of the initial state, we want to change the color of certain events later.
function change_color(event_id){
.....
change color event
}
$(document).ready(function () {
$('#calendar').fullCalendar({
.......
});
});
You can use the eventRender callback to bind a click function or whatever you want to the event elements. In this codepen example I have added a click function that when an event is clicked it will change the color to green with css. You can also access the event properties to do something like event.color = 'green', which will not update on the calendar but could be useful for updating the event in the database.
eventRender: function(event, element, view) {
element.bind('click', function() {
$(this).css('background-color', 'green');
});
}
Hello i'm trying to work with Fullcalendar (from here http://fullcalendar.io) but I don't find if I can change or delete an event already planning on calendar just by clicking on the event area to edit or delete it ? is that possible ? Thanks for your answers
I'll try this at the bottom of my calendar.html file
$(this).data('eventObject', eventObject);
$('#calendar').fullCalendar({
eventClick: function(calEvent, jsEvent, view) {
alert('Event: ' + calEvent.title);
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
alert('View: ' + view.name);
// change the border color just for fun
$(this).css('border-color', 'red');
}
});
Yes this is possible.
1) Use eventClick: to trigger your function when the user clicks on the event.
2) Modify the event properties as necessary, e.g. event.title = "Test";
3) Call updateEvent on fullCalendar's div, with your modified event as the parameter.
I am using Telerik radscheduler when I move appointment then I want open a dialog box and after clicking yes or no, I want to go to OnAppointmentUpdate event.
function onAppointmentMoving(sender, eventArgs) {
debugger;
redgrd = sender;
eventArgs.set_cancel(true);
var appointment = eventArgs.get_appointment();
var confirmMessage = "Do you want to make this the patient's default Round?";
radconfirm(confirmMessage,
function (arg) {
debugger;
if (arg) {
//sender.updateAppointment(sender, eventArgs)
alert("ok");
}
else {
alert("Cancel");
}
})
}
I used the code in screen shot, but after eventArgs.set_cancel(true) I am not able to reach OnAppointmentUpdate event.
Calling eventArgs.set_cancel(true) means that you will cancel not only the AppointmentMoving event but also the flow. That's why the OnAppointmentUpdate event is not fired. Better try to call eventArgs.set_cancel(true) after you get the result from the confirm window.
I have a usercontrol with an asp.net checkbox in it. I'm attempting to write a jquery script to convert that normal checkbox into a three-state checkbox. The states are 'checked', 'unchecked', and 'intermediate'. Clicking on an intermediate state should change the state to checked, clicking on an unchecked state should change the state to checked, and clicking on the checked state should change the state to unchecked.
My idea was to be able to insert a normal asp.net checkbox into the page and then call the jquery function to make it three-state.
Here's my jquery function, which is rough but working:
function SetTriStateCheckBox(checkboxfinder, initialval, originalCkbxUniqueID) {
var i = 0;
var chks = $(checkboxfinder);
if (initialval){ chks.val(initialval); }
chks.hide().each(function() {
var img = $('<img class="tristate_image" src="../Images/tristateimages/' + $(this).val() + '.gif" />');
$(this).attr("checked", ($(this).val()=="unchecked"?"false":"true"));
$(this).attr("name", "input" + i + "image" + i);
img.attr("name", "" + i + "image" + i);
i++;
$(this).before(img);
});
$(".tristate_image").click(function() {
t = $("[name='input" + $(this).attr("name") + "']");
var tval = t.val();
$(this).attr("src", "../Images/tristateimages/" + (tval=="checked" ? "unchecked" : "checked") + ".gif");
switch (tval) {
case "unchecked":
t.val("checked").attr("checked", "true");
break;
case "intermediate":
t.val("checked").attr("checked", "true");
break;
case "checked":
t.val("unchecked").removeAttr("checked");
}
setTimeout('__doPostBack(\'' + originalCkbxUniqueID + '\',\'\')', 0);
});
}
Here's a simplified version of my OnPreRender event handler which registers a startup script:
protected override void OnPreRender(EventArgs e)
{
string tristatescript = " SetTriStateCheckBox('input[id$=\"ckbx1\"]', 'intermediate','"
+ ckbx1.UniqueID + "'); ";
ScriptManager.RegisterStartupScript(this, this.GetType(), "ckbx1_tristate", tristatescript, true);
base.OnPreRender(e);
}
Everything seems to work correctly, except that I'm not hitting the event handler of the original checkbox when I post back, after clicking my newly inserted image. It does hit Page_Load.
If I take out the .hide() part of the jquery, and click on the original checkbox, Request.Params['__EVENTTARGET'] is the same as when clicking the newly inserted image.
I'm not sure where to go from here. Any suggestions?
I decided to go a different way with this. It turns out it's much easier to use an linkbutton, with an image in it, to simulate a three-state checkbox. It has it's own postback events and all you have to do is change the imageurl.
:-)
I have a child window and a parent window with a hiddenfield hdnSelectedFields .I am changing the value of hdnSelectedFields.
Code:
String vStrScript = "<script language=javascript>function CloseParent() {window.opener.document.getElementById('hdnSelectedFields').Value = '" + tempstring + "'; alert(window.opener.document.getElementById('hdnSelectedFields').Value);window.close(); } window.opener.document.forms[0].submit(); setTimeout(CloseParent, 5);</script>";
When I close the window the hdnSelectedFields value is set but when I access the hdnSelectedFields on parent window pageload it shows old value of hdnSelectedFields.
if you see the alert in JavaScriptit shows updated hdnSelectedFields value when parent is loaded completed.
Any suggestion how can I access hdnSelectedFields updated value on parent pageload.
Dee
The property of the input box you want is value, not Value.
first of all: you should go for the #-selector, as ids must be unique per definition!
in your popup:
$(document).ready(function() {
setTimeout(function() {
var hiddenField = $('#hdnSelectedFields', window.opener);
// you could do some checking here, eg. hiddenField.length for ensuring existance
hiddenField.val('new value');
alert(hiddenField.val()); // for debug reason
window.opener.document.forms[0].submit();
window.close();
}, 5);
});
in your opener:
$(document).ready(function() {
var hiddenField = $('#hdnSelectedFields');
var hiddenFieldValue = hiddenField.val();
alert(hiddenFieldValue); // for debug reason
});
edit:
your fatal mistake is following:
function CloseParent() {
window.opener.document.getElementById('hdnSelectedFields').Value = '" + hdnCheckedAttribute.Value + "';
window.close();
}
window.opener.document.forms[0].submit();
setTimeout(CloseParent, 15);
so, what will happen when you open the popup?
... biiig drum roll!
submit the form
wait 15ms
set the hiddenField
somewhere in between pt 1 and 3 your $(document).ready() of your opener happens ...
missing pt 3 (due to parallelism), no value is set to the hiddenField.
you might see my workaround in my solution for your popup, which states:
setTimeout(function() {
[...]
window.opener.document.forms[0].submit();
window.close();
}, 5);
window.opener.$('#hiddenvariable').val('somevalue');