Validation field form using tag "form" with angular-xeditable

viniciusaugutis commented 7 years ago

Hi all. I have a form with some xeditable, which are working, however what I want to do is validate if the form's cpf field is valid. I am using the angular input mask to validate cpf. The problem is that I can not link the form with field cpf, so I can not tell if it is in error or not in cpf.

I've already tried using the name, e-name and e-form attribute and it did not work. Can anybody help me?

The code in HTML

<form editable-form = "", name="myForm">
  <a href = "#",editable-text="$ctrl_pd.patient.document", e-ui-br-cpf-mask,
                      onbeforesave = "$ctrl_pd.checkFieldValid($data, myForm.cpfField.$error)",
                        ng-click = "$form.$show()", e-single = "", e-name = "cpfField">
        <span> {{$ctrl_pd.patient.document || '' }} </span> </a>
     <p> {{myForm.cpfField.$error} aqui  </p>// (myForm.cpfField.$error) always is undefined
</form>

The code in Less

form(editable-form = "", name="myForm")
  a(href = "#",editable-text="$ctrl_pd.patient.document", e-ui-br-cpf-mask,
                      onbeforesave = "$ctrl_pd.checkFieldValid($data, myForm.cpfField.$error.cpf)",
                        ng-click = "$form.$show()", e-single = "", e-name = "cpfField")
        span {{$ctrl_pd.patient.document || '' }} 
 p {{myForm.cpfField.$error.cpf} aqui  // (myForm.cpfField.$error) always is undefined

Better example in the comment below.

ckosloski commented 7 years ago

Can you provide a plnkr or jsfiddle showing your issue?

Is it that you have two fields and you are trying to validate one based on the other?

viniciusaugutis commented 7 years ago

@ckosloski I made a few examples here in jsfiddle that will get easier to understand what I want to do.

I want to do the same thing I did in this example (using form and input), but using form and xeditable.

Here the code with Form and Input

http://jsfiddle.net/vinicius_augutis/tuevy0Lj/

Here the code with Form and Xeditable(not working correctly)

http://jsfiddle.net/vinicius_augutis/ouj3159c/

The problem is that using xeditable I am not able to link the "cpfField" to the form

ckosloski commented 7 years ago

Currently the angular form validations don't work well with xeditable. You would have to use onbeforesave to do your validation.

vitalets / angular-xeditable

Validation field form using tag "form" with angular-xeditable #635