I am creating web app using angularjs. I have integrate the dirPaginate directive for pagination.I am paginate the forms, Pagination works fine.When I submit the form first time.Form submit Succesfully. When I click on next number on pagiantion list and submit form again it says form is undefiend.
Here is Form:
var form = amazon.form; // first time works, after paginate gives undefiend
$rootScope.amazonForm = form;
// Show error messages and exit.
if (form.$invalid) {
if (form.$pristine) {
form.$setDirty();
}
}
You can watch the form and can save the form to $scope
$scope.$watch('amazon.form', function(amazonForm) {
if(amazonForm) {
$scope.amazonForm = amazonForm;
}
});
then can use below code in your function
$scope.amazon.form = $scope.amazonForm;
var form = $scope.amazon.form;
Related
I want to update my data based on data received from back-end
there are two functions:
function getData(data){
Service.getRequest(url).then(function (_response) {
console.log(_response)
var res = _response
if(res.data.success) {
$scope.$watch('data.photo', function() {
alert('hey, myVar has changed!');
});
data.photo = res.data.result;// this will tell that Image received against the corresponding data
}
else {
ctrl.errorCallBack = true
ctrl.errorFunction = 5
}
$rootScope.showPreloader = false;
});
}
now I have second function that receives the selected data and called when clicked on button , now question is can I update the data inside this function when above Get request is completed:
function syncData(data) {
console.log('image received')
console.log(data)
}
First function is called n times based on number of images , now user click on second function to view Image but user don't see any Image because Image is not received yet but I want a way to update second function as Image is received
examples
ist image is loaded....user doesn't click on second function
2nd image is pending....user clicks on second function or second function is active
2nd image is received....active function image received
https://plnkr.co/edit/zKeDT84W6eF9cc3FpcmG?p=preview
If you use $scope for variables they will be automatically sync with DOM whenever it changes.
I did some changes for you in plnkr i hope solve your problem.
http:// plnkr.co/edit/Ug53a03kB7Ap1EWf2jZK?p=preview
Is there a way to get the list of errors from parsley.js? I have a form that has one field that I want validate and give feedback to the user as a warning, but I don't want the error state for that field to block form submission. I am handling the form submission myself, so I'm looking for something like
$("form[name='client']").on('submit'), function(e) {
e.preventDefault();
var form = $(this);
form.parsley().validate();
// pseudo code as I don't know how to do this yet with parsley
var errors = form.parsley().errors().filter(function(err) { return err.field != field_to_ignore })
if (errors.length ) {
// error handling
} else {
// submit form
}
});
You could change the inputs or excluded options when you click on submit so that your inputs are all excluded.
My Solution is to work with two validations:
1.The first one is binding the error to the UI.
2.The second one is after adding the data-parsley-excluded=true attribute to your field_to_be_ignore.
$("#myForm").on('submit'), function(e) {
e.preventDefault();
var form = $(this);
//the first validation bind the error message to the screen
if (form.parsley().validate() == false) {
$('myFieldToIgnore').attr('data-parsley-excluded','true');
//Now let make a second validation:
form.parsley().validate();
}
else {
//submit
}
});
I'm clicking a table row to edit the fields in a modal. The modal must have 2 functionalities (Add or Edit) depending on the GET request data like below.
$scope.editInterview = function(id) {
$http.get('/api/getinterview/' + id).then(function(response) {
editedObject = response.data.item
}
HTML
<label ng-if="editedObject.email">{{editedObject.email}}</label>
<label ng-if="!editedObject.email">Email</label>
<input ng-model="newObject.email" />
I am able to display the object in the labels, but that's not much help, because the data needs to be shown in the input boxes to be Edited and Saved.
How can i show the data from editedObject.email in the input, so i can save it using newObject.email?
I tried ng-init="editedObject.email", but it doesn't work. Is there some other ng-something that does this or i should be doing it in another way?
Update:
Edit and Update Methods, both are in the mainController.
$scope.editInterview = function(id) {
$http.get('/api/getinterview/' + id).then(function(response) {
editedObject = response.data.item
})
}
//Controller for the Modal
function DialogController($scope, $mdDialog, editedObject) {
$scope.editedObject = editedObject
$scope.submitObject = function(newObject) {
$http.post('/api/interview', newObject)
}
}
You have to make a deep copy from editObject.email to newObject.email. This could be done this way in controller after editOject.email has a value assigned.
$scope.newObject.email = angular.copy($scope.editObject.email);
Is there any direct way to get dialog object of all components which are dragged on page.
For ex: when we load page and if there is any component like text, image are on page, I can get dialog. Please suggest?
Yes, it is possible. Attach a listener which listens to the editablesready event fired by WCM. Get all the editables on the page using the #getEditables() method of CQ.WCM and then get the dialog of each editable if it is present.
Sample code below.
CQ.WCM.on('editablesready', function() {
var editables = CQ.WCM.getEditables();
for(var path in editables) {
var editable = editables[path];
try {
console.log(editable.getEditDialog());
//Do stuff
} catch(e) { }
}
});
I am developing an application using Angular js and Taffy DB.
When I click Submit button,the following method gets executed.
javascript:
$scope.addList = function () {
console.log($scope.attendees);
var data=$scope.attendees;
teamlist.insert(data);
};
When I click submit button for first time,console.log($scope.attendees); shows [Object{text="dffsd",$$hashKey="007"},Object{text="sdfsdf",$$hashKey="009"}]
When I click submit button for second time,console.log($scope.attendees); shows
[Object{ text="dffsd", $$hashKey="007", ___id="T000002R000002", more...}, Object { text="sdfsdf", $$hashKey="009", ___id="T000002R000003", more...}]
What may be the reason?
How Shall I check where the data is getting stored?
How can we view the data just like we are checking in mySQL,mongoDB etc.?
Do the data get stored in local storage of the browser?
Please Advice
try:
$scope.addList = function () {
console.log($scope.attendees);
var data=$scope.attendees;
teamlist = TAFFY(data);
//teamlist.insert(data);
};
to check data try;
console.log( teamlist().get() );
Data is stored in an object like an Array in your code