search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

how to remove the new event if inline event edit text is blank

Asked by Simo
5 years ago.

Hi guys.

I was wondering how to remove the new event created in the scheduler if inline event edit text is blank.
actually no eventEdit event is fired, so I can't check if newText is blank or not. it's the same if I click on empty timeRange and then press the esc key without typing anything.

here is my code:

function createAndEdit(start, end, resource) {
var e = new DayPilot.Event({
start: start,
end: end,
id: DayPilot.guid(),
resource: resource,
text: ""
});

dps.events.add(e);

dps.clearSelection();

dps.events.edit(e);
}

you can see the same behaviour in the demo counterpart at http://javascript.daypilot.org/demo/scheduler/eventinlineediting.html

thank you for all your responses.

Answer posted by Dan Letecky [DayPilot]
5 years ago.

In the latest build (8.1.1914), the onEventEdit/onEventEdited events are now also fired when the editing was canceled using <esc> or when the text is unchanged.

The canceled editing is indicated using args.canceled.

See the updated demo in the sandbox:
http://javascript.daypilot.org/sandbox/scheduler/eventinlineediting.html

dp.onTimeRangeSelected = function(args) {
    var e = new DayPilot.Event({
        start: args.start,
        end: args.end,
        id: DayPilot.guid(),
        resource: args.resource,
        text: "",
        tags: {justCreated: true}
    });
    dp.events.add(e);
    dp.clearSelection();
    dp.events.edit(e);
};

dp.onEventEdit = function(args) {
    if (args.e.tag("justCreated")) {
        if (args.canceled || args.newText === "") {
            dp.events.remove(args.e);
        }
    }
    args.e.data.tags.justCreated = false;
};

Note: I'm removing the "lite" tag from this question - inline editing is only available in the Pro version.

Comment posted by Simo
5 years ago.

Thank you, that's just what I was looking for! ;)

Is there a way to set the property tags from the MVC controller?

Just for your information: args.e.data.tags.justCreated = false; throws an exception. Maybe it has to be args.e.tags.justCreated?

PS Sorry for the wrong tagging of the thread

Comment posted by Dan Letecky [DayPilot]
5 years ago.

> Is there a way to set the property tags from the MVC controller?

If you are using the MVC version you can specify the custom fields using DataTagFields property.

If you load events manually using an AJAX call you can just add it to the event data - see also below.

> Just for your information: args.e.data.tags.justCreated = false; throws an exception. Maybe it has to be args.e.tags.justCreated?

The "tags" field is initialized in onTimeRangeSelected:

    var e = new DayPilot.Event({
        start: args.start,
        end: args.end,
        id: DayPilot.guid(),
        resource: args.resource,
        text: "",
        tags: {justCreated: true}                           // <- here
    });

And yes - you should check if args.e.data.tags exists in onEventEdit before using it. Or you can move it inside the conditional block:

dp.onEventEdit = function(args) {
    if (args.e.tag("justCreated")) {
        if (args.canceled || args.newText === "") {
            dp.events.remove(args.e);
        }
    args.e.data.tags.justCreated = false;
    }
};
Comment posted by Simo
4 years ago.

Hi Dan,

I'm using the javascript lib included in the mvc bundle at version 2051.

With the code below the box for editing the event is not showing up. You can see the same behaviour in your demo page for inline editing.

dp.onTimeRangeSelected = function(args) {
var e = new DayPilot.Event({
start: args.start,
end: args.end,
id: DayPilot.guid(),
resource: args.resource,
text: "",
tags: {justCreated: true}
});
dp.events.add(e);
dp.clearSelection();
dp.events.edit(e); // <- here
};

Am I doing something wrong?

Thank you.

Comment posted by Simo
4 years ago.

I'll try to explain myself in a better way.

Before the latest update (mvc 8.1 SP2), once I clicked on an empty cell (timerange) an empty event was created and the box for editing it showed up immediatly.

Now the onEventEdit event is fired, so I can handle the tag "justCreated" like your example, but there is no way to get the box for editing showing up immediatly like before.

how can I restore this behaviour for inline editing?

Thank you.

Comment posted by Dan Letecky [DayPilot]
4 years ago.

And which control do you use - Calendar or Scheduler?

Comment posted by Simo
4 years ago.

Scheduler

Comment posted by Dan Letecky [DayPilot]
4 years ago.

It looks like the problem is with the latest implementation of dp.events.add() which is now optimized to run just one update for all updates made within a single block of code. You should be able to fix it using the following code:

dp.onTimeRangeSelected = function(args) { 
  var e = new DayPilot.Event({ 
    start: args.start, 
    end: args.end, 
    id: DayPilot.guid(), 
    resource: args.resource, 
    text: "", 
    tags: {justCreated: true} 
  }); 
  dp.events.add(e); 
  dp.clearSelection(); 
  setTimeout(function() {
    dp.events.edit(e);
  });
};

Note the setTimeout wrapper. Let me know if it didn't help.

Comment posted by Simo
4 years ago.

I already tried this solution before writing to you, with no success. I tried with 500, 1000, 2000, 3000 but the box didn't show up.

Comment posted by Dan Letecky [DayPilot]
4 years ago.

I have temporarily modified the main Scheduler demo in the sandbox:

http://mvc.daypilot.org/sandbox/Scheduler/

By adding this:

<script>
    function createAndEdit(start, end, resource) {
        var e = new DayPilot.Event({
            start: start,
            end: end,
            id: DayPilot.guid(),
            resource: resource,
            text: "",
            tags: { justCreated: true }
        });
        dps.events.add(e);
        dps.clearSelection();
        setTimeout(function () {
            dps.events.edit(e);
        });
    }

</script>


@Html.DayPilotScheduler("dps", new DayPilotSchedulerConfig {
    BackendUrl = Url.Action("Backend", "Scheduler"),
    // ...
    TimeRangeSelectedHandling = TimeRangeSelectedHandlingType.JavaScript,
    TimeRangeSelectedJavaScript = "createAndEdit(start, end, resource);",
})

It seems to work fine (Chrome, Firefox, IE11). (The event disappears after entering the text because OnEventEdit is not implemented on the server side.)

Are you able to reproduce the issue in the sandbox?

Comment posted by Simo
4 years ago.

In the sandbox now works perfect! Do I have to wait an update or is it a change I can implement now?

Thank you for the effective support.

Comment posted by Dan Letecky [DayPilot]
4 years ago.

There are no changes in the core library (just in the demo). So it should work with 8.1 SP2 as well. You can try copying the configuration from the sandbox to see how it works with your code.

Comment posted by Simo
4 years ago.

Ok, it works. I found a typo in my code. I still have to use the timeout. Do you think that in the next updates I won't need the timeout anymore?

Thank you for all.

Comment posted by Dan Letecky [DayPilot]
4 years ago.

Yes, in the next release the setTimeout call won't be necessary.

This question is more than 3 months old and has been closed. Please create a new question if you have anything to add.