Ember multiple view in same template - javascript

Im expanding the Todo example of emberjs main site ->
http://emberjs.com/guides/getting-started/accepting-edits/
I try to add an extra field to the model called body, and add the same logic, double click for edit. But when I add a second view the body value attached, the double-click event stops working.
I renamed the double-click event and it's not working
http://jsbin.com/atikiv/3/
Why double click is not working anymore ? Also how I can make the 2 fields are editable on double click just one ?
thx

Related

Preventing Apex Button Double click

Hi I have a button that inserts empty records into an interactive grid. I want to prevent the user from being able to double click that button because it populates duplicate rows. I have a server side argument that says if there are rows the button does not appear however they are still able to double click the Populate_tables button before it vanishes. If there are any other solutions to this please sound off. I've tried everything from javascript to server-side but they are still able to double click no matter what. Here are the before and after pictures of the table.
$('#btnPopulateTbl').dblclick(function(e){
e.preventDefault();
});
The above code prevents the double click for a button. This is in jQuery.
Oracle Apex does not offer this functionality as a setting or etc.
However you can use
$('#button').click(function(event) {
if(!event.detail || event.detail == 1){
// This will be executed once even user clicks multiple times
}
});
Note that your selector must be the id or the class you provide to this button.
By default 'add row' button's classes are:
class="a-Button a-Toolbar-item js-actionButton"
Another solution would be to have apex handle this. Suppose this is on page 1.
Create a page item P1_POPULATE_ROWS_CLICKED with a default value of 'N'
In the page process that populates the table, add the following line before the actual load:
:P1_POPULATE_ROWS_CLICKED := 'Y';
Add a condition to the page process that populates the table of "Item not equal to value", P1_POPULATE_ROWS_CLICKED , Y
Yet another solution is to only execute the insert statement if no rows exist with that condition yet. I can't show you how to do it because you didn't show how the table is populated but happy to do so if you edit your question. This last option is propably the most suitable.

How to handle 'Next' button programmatically in SurveyJS? (survey-react)

I have a survey page that created with SurveyJS lib(survey-react) and I have 2 problems:
I want to query back-end server when I click 'Next' button in the survey , if server return a true , then jump to next page , if false , stay in current page and do something else.
so what I need are:
1.to handle the event of 'Next' button myself.
2.to trigger next or previous event manually.
and the second problems is, if I have 2 input element in survey , and I want to show validation message if the amount of these two input more than 100.
is there a way to do these 2 requirements?
update:
now I override the 'Next' button event by getElementsByClassName , it can excute my function, but still trigger 'nextPage()'. is there a way to prevent the default event?
You can hide built-in navigation and create your own. It about 10-20 lines of code.
Here is the live sample - https://surveyjs.io/Examples/Library?id=navigation-custom&platform=Reactjs&theme=modern

Two way binding for checkbox inside an accordion not workiing

In my angular 1.5 html5 application, I have an accordion group and inside it's body I have Couple of check-boxes. Since direct scope binding will not work inside accordion, I'm using ng-click event as attached.
This works as expected, I'm getting click events with correct value.
I have another reset button on screen, when user clicks this button I have to reset all filters including the checkbox inside the accordion. Even after I reset the model value to false, checkbox still shows as checked. I know this is because the binding is not there.
How can I update the checkbox value from javascript. Is there any angular way. I'm not a big fan of JQuery.
Regards,
Nixon
We faced a similar issue with the data bindings while using accordian.
Instead of using directly model variable, we created an object of it.
For eg, instead of using $scope.includeLocalParties, try using $scope.checkbox.includeLocalParties.
Also initialize it in your controller. Something like this:
$scope.checkbox = { includeLocalParties : false};
Hope it helps!

Javascript event on form add fields

I've got a rails app using bootstrap with a form page that has the option to add additional form fields. The tutorial from this Railscast episode heavily influenced this form page add fields feature. I have a need to watch the add fields so that I can hide a warning panel in the new well created. Here is the code that will not work(in coffeescript):
$('#classifications_forms').on 'change', (event) ->
container = $('.classifications_form').last()
$('#premium-divide', container).hide()
Here is the code in jquery:
$('#classifications_forms').on('change', function(event) {
var container;
container = $('.classifications_form').last();
return $('#premium-divide', container).hide();
});
I have tried an on click event for the add fields button, but it's late in the event watching as it will not hide the panel. If I hit the button a second time, it will hide the panel on the previously created well, so I know the code was working to hide the panel. My thinking is to hide the panel on the last well created, and I thought that a change on #classifications_forms would give me the event needed to hide the last well, but I guess its missing something on the event. What is missing above?
Here is a jsfiddle demonstrating the problem.
Because I was using bootstrap, I found a class to apply to the panel which took care of my problem:
.hidden

Newly inserted element, Colorbox does not attach to the correct event

I have a table where I want to dynamically add a row. This part is working fine and I am using jQuery to insert the new row. The problem is, the row includes two links for 'edit' and 'delete' which are attached to Colorbox popups. Existing rows work fine with Colorbox, but the new rows attach both links to the 'new user' Colorbox, instead of the 'edit' or 'delete' popups as appropriate.
Another strange behavior is that the links are correctly attached once you click on any of the older links. Steps to recreate:
Click on "Add New Person"
Click on "Add"
Click on "Edit" for the new row - it
shows the Add New User colorbox
Click on "Edit" for one of the
existing rows
Now click on "Edit" for the new row - it correctly shows the Edit colorbox
I have tried to create the simplest test case possible at http://pastebin.com/i8n3t2Yt. If you want to run it on your local machine you'll have to download the Colorbox JS at http://colorpowered.com/colorbox/.
It sounds like the code that attaches events to previous rows is not being executed to newly created ones afterwards. you need to re-run the code either explicitly or attaching a callback to an event that is notified when you add new rows.
[Editor looks at code]
Ok I have just reviewed your code and it is definitely the case. you are using the 'ready' method which runs once and then that's it - It's not triggered again thereafter. SO any new nodes do not have the callback attached.
Because I was creating the new row using .clone(), it wasn't cloning attached events. Clone has an optional parameter .clone( [ withDataAndEvents ] ), which was previously defaulted to true but changed in 1.6, I believe. I thought that since Colorbox used .live() to attach events, I wouldn't need to specify true for [ withDataAndEvents ] but apparently I did need to.

Categories

Resources