Angular - async context validation - angularjs

I am newbie in angular so please keep it in mind. I want to create dynamically some items. In my example item has id and name. Items should not have the same names within scope. Moreover items should not have the same name as items already stored in db. I looked for some kind of ng-remote but I didn't find any which would fulfill my needs. So I created my own async Validator. Here is simple example:
plnkr.co/edit/yEXUnEjd6JC7bFOOSErC?p=preview
Everything works great in simple scenario:
1. user creates first item with name "Test"
2. User creates second item and try to set name as Test then validation occurs. User change the second name as test2. Everything is fine.
BUT. Take a look into second scenario:
1. user creates first item with name "Test"
2. User creates second item and try to set name as Test then validation occurs.
3. User leave the second item and change the first one to "Test2". Validation is still visible because angular validate only item which changed.
So I need to ask how to resolve this kind of issue? I thought that maybe during submit I would rerun validation for each field. But I don't know how. Is there any other ideas?
I spent a lot of time trying to resolve this issue and I couldn't do that.

Related

How to save a recordset without overwritting existing records with Cakephp 3

Is there an easy way to save a recordset, i mean multiple records, but only the "new ones"?
I have a table users and a users form in the view. First field you must enter is passport number, so if user already exists in database the rest of the form will be auto completed and disabled to prevent changes but if passport dont exist then you have to enter all data. As anyone can change those existing users data controls from the browser even if they are disabled, i want to make sure only new records are saved in database. First of all i thought i could find again in database and delete existing users from recordset before save, but i wonder if there is a more elegant approach.
Ty in advance.
I write this here, cause comments are too short:
Thank you for your answer, André. I'm sorry if i didnt explain perfectly, but the form is done by disabling all controls except passport and if passport dont exist (i check it on passport focusout) then the rest of controls are set to enabled. I mean, that is already done. The question was only about the saving.
The validation method you talk about, well i'm actually validating all the controls in the form and i must disable the 'unique' rule so a user can link an existing user to the current bill, otherwise it will fail validation on submit and it wont allow the user to proceed (i did this because it happened to me when testing). The actual setting is much more complicated: the form belongs to a model (bills) which is associated with 4 other models and 2 of those relationships are many to many, bills_users and bills_clients, where users are the persons who do the job and clients pay for it, but I was trying to make the question easier. Anyway, what I am looking for is, in fact, some kind of saving setting which I can't find. In documentation I found "When converting belongsToMany data, you can disable the new entity creation, by using the onlyIds option. When enabled, this option restricts belongsToMany marshalling to only use the _ids key and ignore all other data." The first half of the sentence was promising, but the explanation says different, and I actually tried it without success.
First:
Is there an easy way to save a recordset, i mean multiple records, but only the "new ones"?
Yes there is you can validate it in model, something like this:
public function buildRules(RulesChecker $rules)
{
$rules->add($rules->isUnique('passportNumber'));
return $rules;
}
This will prevent to save a duplicate passport number register, but you can different.
I have a table users and a users form in the view. First field you must enter is passport number, so if user already exists in database the rest of the form will be auto completed and disabled to prevent changes but if passport dont exist then you have to enter all data.
There is two different ways to do this:
First you have your form, you develop an ajax function when you fill the first field (passport number) this ajax function do a request to your controller to search for a passport with that number if find something get data and fill others fields and turn them just readable, else just nothing and let user fill the fields by himself
second add a step-by-step where you first do a form to try find by pass number, user fill this only field with a number then submit, on submit this search for a record, if find fill the entire next step fields, else the next step will be the rest of form with the fields to be filled.
This may help you too: https://book.cakephp.org/3.0/en/orm/validation.html
Tell me how you decided to do :)

Show and hide server-side errors in AngularJS 1.3+ forms

I'm using the Angular framework with Angular Material controls in my recent application. I'm looking for a good solution for the following problem:
A form form with an input field named nickname is shown to the user. After the user has chosen a nickname and submitted the form, the server checks whether the nickname has already been taken. In that case, it returns an error to the Angular client.
To show an appropriate error to the user, the code then calls form.nickname.$setValidity('nicknameTaken', true). The new ngMessages module is used to display the error to the user. Further form.$isInvalid is used to disable the form controls to prevent the user from resubmitting the invalid nickname.
My problem is now the following: I'd like to have the error nicknameTaken automatically being removed as soon as the user begins to edit the form fields again. What is a good way to do this? Is there a predefined route to go when it comes to server-side validation errors of this kind? (Note that I am not asking for asynchronous validation because I only want to contact my server when the form is actually being submitted.)
I would write a normal validator directive instead. Something like
<input blacklist="takenNickNames" .../>
This directive would simply add a validator to the input, and this validator would make the input invalid if the model value is contained inside the given takenNickNames array (and valid if it's not present).
The takenNickNames array would be empty initially. When the form is submitted and the error comes back, the controller would add the invalid nick name to the array.
So, every time the user would enter something, the validator would be triggered, and would set the field valid or not, based on the taken nicknames stored in the array.
Here is a working example.

Why can't I find my fiddles using 'View My Fiddles'

I started using Sencha Fiddle, and I have a hard time to get it work. So far I created two fiddles, but I can access them only via their URL fiddle 1 and fiddle 2. But when I want to access them through the user menu username - View My Fiddles, I get an empty list *No fiddles found, even though int the Details section, the field Author my username is filled with my username.

AngularJS watch not working in child controller

I'm trying to use AngularJS and Angular-UI-Bootstrap to create a WebApp but as I'm rather new with all this, I need some help. I'm using ng-repeat and an array to create a Tab interface.
Depending on an action in the first Tab, a second Tab is added to the interface or should be refreshed if it's already open. I've got the Tab working and have a check to make sure it isn't added again when it's already open.
The basic structure is the following: One controller (TabController) to control the Tab interface, and one controller (Tab1 and Tab2) for each Tab that's added to the interface.
Now, I have the following problem, the content of the second tab should change depending on data changed in the first tab. When the user confirms the data in the first tab, I execute a function in the TabController (to add / activate the second tab) that also changes some data in the scope. I can't seem to be able to detect the change in this data in de second tab, I've created a watch for the field, but it's only fired the first time the tab is loaded. If I use the field itself, the data is changed, but the watch doesn't fire. Anyone got an idea how I can get this to work? The data that changes should be used to make changes to other information, that's the reason I'm trying to use a watch and execute a function...
I've created a Plunker that should demonstrate in a simple example what the problem is and what I'm trying to do (I hope...)
DEMO
On the first Tab, there is a button to add a second tab (or activate it), as an example, I just increase a count that's displayed on both tabs. On the second tab, I have a local field on the scope that I fill with the global field using a $watch.
When starting the first time, the global count is one, after adding the second tab, both the global as the local count on the second tab are 2. When I go back to the first tab and click the 'Add tab' button again, the global count on both tabs is 3, but the local count on the second tab remains 2 and the watch isn't fired.
As I'm new to Angular (and web programming) I might be trying to do something that goes against all the best practices, so if someone has a better / different way to do what I'm trying to do, feel free to make any suggestions.
Your watch expression was incorrect, the correct expression would be
$scope.$watch("tabCount",
function() {
$scope.localCount = $scope.tabCount;
})
}
instead of
$scope.$watch($scope.tabCount,
The first one means you want to watch on a variable tabCountdefined over the scope.

ZK window not unique in ID space

In our project we use ZK for webpages. There is a combobox which has lists. When selected, it fetches data from a java object through onSelect, i have given the logic.
when i select one there are 4 listboxes on that page to be filled with data according to the selection. when i select first time, no problem occurs.
But on second time i get an error pop-up like "Not Unique in the id space of Window" and showing the list box item id which have to be filled on select.
Can any one help out there?
Note: Though it shows this error i get the listboxes filled correctly according to the combo box selection. Still i cant stop this error occurring..
Your issue is a conflict of ids in ZK's id space.
A bit of background..
ZK generates ids for components at runtime, if you open up the DOM in the browser you'll see each component has some machine readable id.
However, you can also give components an id. This id does not go to the DOM but lets you reference the component in your application.
These two shouldn't be confused. The conflict you're experiencing is with the latter type of id; you are assigning a component an id in your Java code or in your ZUL file which, at runtime, is not unique.
The case you describe where it only happens the second time you click is a tell tale sign here. The content you are adding on the event has an id defined in it and you are not removing this content when you are done.
Consider the following example:
#Wire
private Window myWindow;
#Listen(Events.ON_CLICK + " = #myButton")
public void onMyButtonClicked() {
Label myLabel = new Label("sean is cool");
myLabel.setId("myLabel");
myLabel.setParent(myWindow);
}
This will work the first time you click myButton, but will throw your error on the second click. That is because the second event tries to add myLabel to myWindow but there is already a myLabel there.
There are lots of ways to resolve this depending on what you are trying to do.
Have a look through the ZK documentation on ID Spaces for more.
I also faced the same error.
My scenario is the same, only the widgets being used are different.
Hence putting my workaround here.
I have put the following piece of code in the doBeforeCompose() method of the composer:
Component widgetWithId = page.getFellowIfAny("widgetWithId");
if (widgetWithId != null) {
widgetWithId.detach();
}
Here widgetWithId is the component/widget, which is tried to be regenerated by the code, with the same Id and ZK is throwing error for it.

Resources