You can reproduce all next steps on standard kendo UI Scheduler example. For example on this: http://docs.telerik.com/kendo-ui/web/scheduler/how-to/dynamic-calc-of-height
Click on empty time slot.
Editor pop up is opening for creating new event
Type title etc.
Click "Save"
Now we see new event on the scheduler table.
But if we do next:
Click on event
Editor pop up is opening for editing event
Click on cancel.
Scheduler - delete the event!
How to save event and prevent this scheduler incomprehensible behavior?
But on this example all works fine.
http://docs.telerik.com/kendo-ui/web/scheduler/how-to/add-control-to-customeditor
Please, explain some one, what is happens? What is the reason of different behavior?
The reason for this behavior is the missing dataSource "schema.model" configuration which is mandatory for the CRUD operations. For more information about how to set up the Scheduler you can check the following help article:
Scheduler: overview
Related
I want to use react devtools to see the source code of an onClick function on a website, specifically, wanderu.com
Please note I am new to react devtools and do not possess yet a good understanding of how this works. I've spent about 2 hours trying to figure this out
On the site in between the destination fields there is an image tag that when clicked, it changes the order of the destinations:
I want to use react devtools to find the code to see how this works.
When I open this in the react dev tools, I can see the following:
When I expand the onClick tab, it doesn't show me anything.
Why? How come in this tab I cannot see the function that onClick is tied to?
When I step back and look at the component, I can see the props of the component that contains this feature:
But I don't see how or where to find the function that is responsible for switching the two input fields.
Google search of "get onclick function react devtools" and relevant keywords doesn't give helpful results in regards to see a function tied to an eventlistener in context of react, just vanilla JS.
In context of React and React devtools, how do you see a function that is tied to an event listener?
One way to begin this task is to set an event breakpoint.
Go into the "Sources" tab in devtools, expand "Event Listener Breakpoints", find and expand "Mouse" and select "click". This will cause the code on that page to pause execution and you can inspect the code involved.
I tried this out on the website you provided and found the code to be minified/obfuscated which as you can expect, makes debugging and reverse engineering difficult, but not impossible.
If you right click the function/event in the props menu and then select
<> Go to definition
it should bring you to the source code of that function.
I'd like to trigger an action after select2 display the results.
The 'select2:open' event triggers the action AFTER the select2 is opened but BEFORE it displays the results.
Does anyone know how to do it?
The Select2 will trigger a few different events when different actions are taken using the component, allowing you to add custom hooks and perform actions.
As far as I understand you need something like select2:loaded action. Unfortunately there is no such event right now, according the documentation.
Try to use select2:select - This is triggered before the drop-down is opened, this event can be prevented or select2:closing.
The docs say the scheduler change event is "Fired when the user selects a cell or event in the scheduler."
Great. The problem is that event is also fired on browser window resize. My app now thinks when the browser window is resized that the user clicked in a cell.
How do I distinguish between these two conditions?
Thought I had the answer here but no dice. No idea what causes the scheduler to fire the change event on resizing. I am showing it in a Marionette JS view. Maybe that has something to do with it? Not sure. It shouldn't.
I know it's all wired correctly because the calendar works properly when clicked - correct views are displayed based on whether a calendar slot has an event or is blank. But the change event fires when on window resize causing my app to fire view changes. A break point in the scheduler change event confirms it is firing on window resize.
Below I tried ditching the change event in favor onClick based on some prescriptions found in various posts. Ugly code but it worked in Chrome. Unfortunately doesn't work in other browsers. Why is there simply no "onClick" event? I just looked at a competing scheduler product and it has one.
Chrome only solution: "e" below is the onClick event object:
//Get the element ID - the DOM ID of the thing that was clicked. You'll use it to
//dip into the scheduler data model to get the event specific data you're after.
var uid = e.toElement.parentElement.parentElement.attributes[2].nodeValue;
//Get a reference to the scheduler data model
var scheduler = $("#scheduler").data('kendoScheduler');
//Use the uid to find the event associated with the click action
var event = scheduler.occurrenceByUid(uid);
Here are the posts that helped formulate that Chrome solution:
Call Scheduler events from EventTemplate
Kendo UI scheduler doesn't allow for reliable cell click event handling
Problem with this obviously is that it doesn't work in other browsers. That uid value (e.toElement.parentElement.parentElement.attributes2.nodeValue) is in different places in different browsers. So this solution is a no go.
I have no idea how a product like this doesn't have an onClick event. Likely have to use a different calendar. Very frustrating.
The issue at hand is I am rendering this calendar in a Marionette js item view. when a scheduler cell item is clicked I take the user to a different view. But the event that is used by the scheduler to handle clicks, "change", also fires on browser window resize. So on a browser window resize my app takes the user to a different view. Not good. No work around.
I have implemented an onclick event in slickgrid. It works fine if I click on the grid using the mouse but if I trigger a click event from the web console, the value of the row in args is displaying as negative. So I'm not able to proceed further. Any help is appreciated.
grid.onClick.subscribe(function(e, args) {
var row = args.row;
The row is coming as negative if I trigger a click event on the grid using javascript from web console.
I found the solution for the issue. We can trigger the slickgrid events in following ways:- grid.onClick.notify({row:0})
I'm after what seems to me to be a straightforward pattern for handling page refreshes when I've got a drop-down that reacts to the onchange event.
I've used the following in the vb code behind (in the Load handler):
MyDropDown.Attributes.Add("onchange", "ProcessDDChange(this.value);")
Function ProcessDDChange() is in-page JavaScript that grays out some other form inputs for certain values of the drop down.
This works fine, but after a postback, onchange is apparently not fired when the previous state is restored, so disabled boxes are enabled again.
I've investigated load events (page and drop-down), but both fire too early to be of use and I can't see any later options.
Is there a standard way of doing this? I need a hook for running a js function post DOM setup, post asp state restore.
Info
I'm using .net 3.5 and I'm looking for a cross browser solution. This is not my project, so I can't add jQuery (much as I'd like to) or other libs.
You could wrap the dropdown in an update panel and set the trigger for the change event like epascarello suggests. Have you tried adding it to the markup like
<asp:DropDownList runat="server" ID="MyDropDown" onchange="ProcessDDChange(this.value);"></asp:DropDownList>
EDIT:
So you are loosing the onchange listener when you postback, the above example should preserve it. But if not you could also try this in the codebehind event that you would like to have call the ProcessDDChange: for vb.net
ScriptManager.RegisterClientScriptBlock(Me, Me.GetType(), "err", "ProcessDDChange(this.value);", true);
FINAL EDIT:
Thanks for sticking it out with me Bob, while I was attempting to understand the question:
The document.ready event is raised after the PageLoad event is complete and the DOM is constructed. This would be the proper place to call your ProcessDDChange().
document.addEventListener("DOMContentLoaded", function(event) {
ProcessDDChange(ddlId.selectedValue);
});
onchange does not fire when the page loads. You would need to trigger the function on page load OR you need to have the server set up the page correctly from the start.