Call other functions inside of Javascript function - javascript

I'm having a problem and I feel like I am losing my mind over it. I am attempting to call on Javascript functions on a button click in an asp.net MVC project. My fuction on button click is this...
// This function calls all functions needed on click of Problem card
function CardButtonClick() {
ChangeColors();
HideForSelectionsToBeMade();
ShowGradeAndWorkOrder();
AddToListOfDropDownSelections();
}
For some reason this is working but it is not running AddToListOfDropDownSelections(), I have changed the function where it is simply just an alert like this...
// This function adds the values of the dropdown list selections to ListOfDropDownSelections for user view
function AddToListOfDropDownSelections() {
alert("test");
}
Does anyone know why the other functions would run and not this one?

Related

When input box is filled through jquery, the ajax function should be called

I have a form which is populated according to the item selected from popup form. When the input box named "organization" is populated the ajax function should be called. Any idea is highly appreciated ?
If I understand correctly you want to call an ajax function when an input is filled. You can bind an event to your input with
$('#your_input_id').on('blur', function() {
//your ajax call
});
this way your ajax function will be called when the focus is lost on your input
You could also bind when the user presses return / use a timer function to call the ajax function when the user stops typing for X seconds
You want event handler which calls by name attribute so the following code will work :
$('input[name="Organization"]').on('blur', function() {
//your ajax call
});
You can use
focusout jquery method
$('#your_input_id').focusout(function() {
// do stuff here
// use constraint .. it field is not empty whatever is it require
})
More detail Official site

Angular execute async function in ng-click

I have a ng-table in my webapp with a lot of rows per page (up to 1000).
I also have a select-all checbox that call a function ng-change to set the flag selected to true in each table row.
The function require some seconds to be executed so user can click two or more time on the checkbox and i want to prevent this. I would like to disable the checkbox while the function is executed.
Is it possible to do this?
Thanks
perhaps you can create some marker for ng-disable. like this:
<input type="checkbox" ng-disabled="inProgress">
and in controller when treated your function add this marker:
$scope.runYourFunction = function() {
$scope.inProgress = true;
....... your function ........
$scope.inProgress = false; // in the end. it will enabled your checkboxes;
}
A very simple solution, not necessarily optimal, would be to update a logical property in your controller (set to true when the function is executed and back to false when finishes) and use a "ng-disabled" directive based on that property in your check-box.

jQuery onclick call function

I've found a script that converts json file into quiz using jquery.
I am playing with it's code for almost a day now and I can't come with what I wanted to have.
Functions quiz().init(); and quiz().bindSubmit(); are called when page loaded.
What I want is the START button must be clicked first to load the Quiz.
$("#start").click(function(){
currentQuestion = 0;
questionCount = 0;
answerArray = [];
infoMode = false;
gotData = false;
inMemoryData = [];
quiz().init();
quiz().bindSubmit();
});
HTML:
<button type="button" id="start">Start</button>
<div id="quiz-content"></div>
It works at first click of START button also in the next clicks, it successfully reset the quiz and goes back to #1.
But the problem is after the first click of Start Button, the quiz won't work normally when submitting the quiz. The quiz began to stucked in #1.
For better understanding, JSfiddle here.
Edited:
Basically when the user click start button more than once,the quiz gets started from the beginning ,but didn't get to the next question(Gets stuck on the 1st question itself)
When you call bindSubmit function, inside it you are attaching to the submit event of the #quizForm. So when you press Start button twice, there two event handlers attached to the same event and that is because it is not behaving as it should be. So inside the bindSubmit function you need always disconnect all submit handlers ($(document).off('submit');), like this:
var bindSubmit = function () {
$(document).off('submit');
$(document).on('submit', '#quizForm', function (event) {
event.preventDefault();
next(this);
quiz().init();
});
};
Here is your original fiddle with mentioned update
https://jsfiddle.net/t4p8x02b/35/
There are couple of things i observed in your code, which needs to be rectified for better management of code:
There is no need to expose init() outside your quiz library, for first time initialization, you can call init() before your return from the library(end of quiz() module code).
Also exposing init() makes your quiz() module vulnerable since it can be modified by any external program which could spoil your entire quiz() logic.
Inside bindSubmit(), you dont need to re-initialize your quiz instance to call init(), rather just call init()(refer below code snippet), your event handler will call it without any error [This is the magic of Closure].
bindSubmit():
$(document).on('submit', '#quizForm', function (event) {
event.preventDefault();
next(this);
init();
});

call a function attached to custom button on onload of CRM Form

I am trying to add a function to each and every entity on save event.
For that I have added a button to application ribbon , so it will be shown on each and every entity and attached my function to it.
But now I have to add this function to onsave of form without clicking the button.
Here is my function:-
function test()
{
alert("hello");
Xrm.Page.data.entity.addOnSave(addMethod);
}
function addMethod()
{
alert("i am added");
}
What I needed to do was just add a enable rule to my button command.
Problem: Need to replace a generic plugin registered on each and every entity update event with a javascript function.
Solution:
Created a solution with my custom webresource and Application ribbon.
With the help of Ribbon Workbench added a button to entity form.(Button added to application Ribbon is added to each and every entity)
Added a enable rule to return false always to hide my button :
function enablerule()
{
Xrm.Page.data.entity.addOnSave(addMethod);
return false;
}
function addmethod()
{
//my logic
}
and that logic replaced a generic plugin server side code with client side code :)
I know this is not a supported way, but I had to do anyway. I told my Team Lead about it, but he wanted it in any way. So, please, no comments on that.

JQuery "undo" an action by calling another function when back clicked

Is there a way to "undo" a function executed by jQuery when the back button is clicked? For example, my function that I want to execute is named doSomething:
function doSomething(button) {
...clicking the button does something...
}
And I have an undo function that undoes the above function, undoDoSomething:
function undoDoSomething(button) {
....undoes the doSomething function...
}
How do I call the function for the button and then if the back button is clicked right after I execute the function, I can call the undoDoSomething function to undo that function?
I know jQuery History goes back to a previous page saved in history but how do I use that to call a function?
the history api makes this easy: http://jsfiddle.net/Z9dRY/
html:
<button>Increase</button>click back button to decrease
<span id="counter">0</span>
js:
$("button").click(function(){
var count = +$("#counter").text() + 1;
history.pushState({count:count});
$(counter).text(count);
})
$(window).on("popstate",function(e){
if (e.originalEvent.state)
$(counter).text(e.originalEvent.state.count);
})
On each action, add to the history, and then each back button click will undo each change (of course, you have to develop the undo part. In this case, i just stored what the count should be changed to at that point and changed it.)
https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history
Take note of the browser support, this code will work in all modern browsers and IE10+. oldIE will need a workaround either using an iframe or a hash in the url.
Here's the same example with an added decrease button to show that it doesn't really change anything: http://jsfiddle.net/Z9dRY/1/ it even inherantly supports the forward button(redo).
Update: fixed losing initial state: http://jsfiddle.net/Z9dRY/2/
You could call your undo function on the window.unload event
window.onbeforeunload = function(e) {
undoDoSomething();
};
You can usue beforeunload that is executed when leaving the page
var called = false;
function doSomething(button) {
called = true;
}
$(window).on('beforeunload',function(e){
if(called){
//call your function here
undoDoSomething()
}
});

Categories