I have a master detail form in angularjs. The form is typical transactions form with some master data like Name, type etc. The detail part contains many lines (can be added and deleted). Each line has input fields for Credit, Debit and Account Number. I have been able to add the required validations both on master portion of the form and detailed portion as well using ng-form directive. My form looks like following
you can see that I already have Add Row button that will add row on detail portion. Now I have strange requirement that is to add a row automatically when user is entering data in last row. I have even done that using ng-focus directive but the next part of requirement is to remove the last row from validation context if it is not used (not dirty) and successfully submit the remaining form. How can I do it in angular. Please find the Code on Plunkr and guide me how I can remove last row of detailed portion from validation context if it is not dirty.
ngRepeat sets $last to true for the last row. So you can just disable ng-require if an input is on the last row.
You could do something like data-ng-required="!entry.DebitAmoun && !$last" and similar for each input.
The above will work if you assume that last row always contains empty input fields. Whenever the user adds any value on the last row, then a new row is created.
Related
I would like to handle the dirty state for every single row I have in my table. Unfortunately, adding a form around a would break the table, and I can't create it inside since I have a field for every different column. My last column for each row contains buttons: Delete and Update. Update appears only if one of the field of this row has been made dirty.
Somehow, it works already but I am checking each .pristine for every field on that row (#name="ngModel"). My rows are created through something like *ngFor="let row of rows". I believe it would be better to check the .dirty or .pristine on a form rather than on every single element.
Also, if I actually to the update, there is no way I can remove that .dirty status (I tried replacing the data for that row by removing from the array and re-adding it but it is still dirty).
Is there a technique to go around that?
You could use ngModelGroup around each of your rows. Then you can check the dirty flag for the group.
I inherited the old code and trying to add some new functions. For now there is large form in 2 column table, first column has checkbox (yes/no), second input fields / textareas with description.
At checkbox are on the onclick event to check the condition and according to him, activate or block the second column.
I removed all the if statements and made big function full of if which check checkbox state and changing by element id state of input fields.
I wonder if you have idea how write univesal function to activate inputs in td next to that in which the checkbox is.
Function consisting of dozens of conditions to check the condition of one field and changing the status of another is a bad practice thats why I am asking you guys how to bite it.
I have a Tabular Form with a few columns, one of which is a numeric entry that has values 1 or 0, represented by a checkbox.
I'd like to create a "master-checkbox" that would check all the checkboxes in this column, but it wouldn't sumbit the page, the user would have to do it manually by "Apply Changes".
I figured out that I need to use apex.item and some javascript and unfortunately, that's as far as I got.
Actually, it wasn't as easy as the google results suggest.
Apex' checkbox appears to be just a cosmetic thing and the real thing is hidden.
My colleague helped me to do something like this:
$("td[headers=APPROVED] input[type=checkbox]").attr("checked", 1); // this is the "visual" part
$("td[headers=APPROVED] input[type=hidden]").val(1); // and this is he one that gets stuff done
"APPROVED" is the name of the column I am manipulating.
I am trying to add rows dynamically inside a grid using a button and remove individual rows using an action column function. I have two text fields (name, email) inside the grid on each row. So when the user hits the add button, a new row should appear with name and email fields. The third column would be an action column and when the button in the action column is clicked the entire row should be removed.
It would greatly help me out if somebody could share some sample code for me to get started.
There are some great code examples in the docs. This is where you have to head first, before asking here.
Look at this row editing example.
I'm trying to implement 2 things:
Adding edittype:'password' to one of my columns so I will be able to see *** instead of the actual value itself. The problem here is that I see *** only when I edit the row, but when I select another row, I save the old row, and disable it from editing mode, but now when it's not an input I can see the actual value - so it's like I never used password input. What do I need to do in order to see the value as password also when I'm not in edit mode??
I want to condition the password column not to be on all rows of this column, is that possible to do? I want to check another value from the row and only if it equals a certain value I want to set the field as password, and if it's not equals to leave it as a regular field. How can this be done?
1) When you select another row and change the old row to disable edit mode, replace all characters in the textbox with a '*' after saving the row. Since it's saved you don't need to maintain the value since it's not an input anymore.
2) use jquery selectors to selectively place the password attribute based on the value of the other row, also selected using a jquery selector. Since it seems like a grid you are working with all cells should have a unique identifier to use for selection.
The conditioning of the column would probably be easiest to set after rendering. Without having more information about the grid layout and specifics about the columns some of this is guess work.