I am working a submit form and I have a hidden input field. I want to set the value with AngularJS, however it will be sent with the form, so it looks like this:
<input type="hidden" ng-model="formData.articleId">
How exactly can I put a value to it with AngularJS? I tried adding ng-value="article._id" to it which added a value field with the id of the article, but it did not parse on submit.
I also tried grabbing this model with AngularJS, but again it did not work:
$scope.formData.articleId = data.article._id;
It said: Can not find articleId of undefined
Am I using a wrong approach?
Try:
$scope.formData = { articleId: data.article._id };
You should use the angular implementation of Form rather than relying on a normal submit with an angular interpolated value
https://docs.angularjs.org/api/ng/directive/form
Related
I have a Autonumber field called 'ID' that generates an ID for a record. I want to set the Primary Name field called 'ID_Name' to this. I am currently using the following JS:
function setName(executionContext) {
formContext = executionContext.getFormContext();
var name = formContext.getAttribute("id").getValue();
formContext.getAttribute("id_name").setValue(name);
}
Pretty simple. I get the value of 'ID', assign it to a var called name, then set the value of 'ID_Name' to that var. This triggers OnSave.
This works fine when editing a record. The problem is, this does not work when creating a new record. I assume because at the time the OnSave triggers, Autonumber field 'ID' hasn't generated a value which can be used yet, so ID_Name is set to blank. Of course while editing, ID has a value because the record has already been submitted, so no problems. Is there a way around this issue?
Just set the OOB autonumber option on the primary name field of your entity. No code required and it saves you from duplicating data, which should be avoided when possible.
You can do some workaround using the OnLoad event and trigger an update when there is a mismatch between the two fields (meaning the value has not been saved) but I strongly suggest to don't use this kind of approach.
Ideally this can be solved using a synchronous plugin inside a post operation, at this moment in the pipeline the id field should be filled (you didn't mention if you are using the OOB autonumber or something different to generate the content of this field) and you can trigger the update inside a plugin.
I have a number input in an Angular Reactive form, I got a directive to limit the number of decimals, and that are working fine, I am looking to implement auto-correct as part of that directive, which is also kind of working but not the validation.
<input type="number" formControlName="TestPercentage" id="TestPercentage" max="100" step="0.25" numeric [decimals]="2"/>
ts file
this.form.addControl(formConstants.markupPercentage, new FormControl('', [Validators.min(0), Validators.max(100)]);
I am using the decimal number directive from https://gist.github.com/ahmeti/5ca97ec41f6a48ef699ee6606560d1f7 and the part where I am changing value
if (Number(currentValue) > Number(this.el.nativeElement.max)) {
this.el.nativeElement.value = parseFloat(this.el.nativeElement.max).toFixed(this.decimals);
this.el.nativeElement.updateValueAndValidity();
}
this one is making the value to max value but not removing the invalid class/ not revalidating or the new value assigned in the directive is not getting validated.
How can I trigger the validation once I changed/ corrected the element value?
The way I resolved this issue is by passing the abstract control to the directive and setting value using setvalue method, which resolved the issue.
Excuse me if this a silly question,but I have tried so much. I have a two form fields which duplicate with add button. So here I am trying to access the input from value formfield using ngmodel. But when I duplicate the set of formfield using add button. The input which I entered in the value form field repeats when I click the add button. This happens when I am using ngmodel to get value. Is there any other way to solve this? Comment down if u have any doubts regarding the question
My sample code: https://codesandbox.io/s/formarraydynamic-forked-t7y9u?file=/src/app/app.component.ts
To get the value from Form and show it in UI. You can create a getter property in component which will return the value from that particular field like this.
get values() {
return this.myForm.value.map(x => x.value);
};
Add then bind this variable into your UI like this.
<p>result:{{values}}</p>
As your form is an formArray you will get your result in an array type.
I'm trying to get the value of a select form field, before it's submitted and save the value into a variable. I know that you can't do it with Rails only. So JavaScript/Ajax will do the trick. I'm pretty new to Rails, so I hope you can help.
Using Javascript
var form_field_value = document.getElementById("pass-id").value
Using jQuery
var form_field_value = $("#pass-id").val()
Each of the above ways, will save the value in your DOM, so you can access it later. Do make sure, of the scope of the variables, when you are declaring them :)
before it's submitted and save the value into a variable
This is the realm of jquery/javascript -- anything on the client side is JS, not Rails.
Rails/Ruby is basically like PHP -- it runs on the server.
Although #Sudipta Mondal's answer will help, you have to remember to bind your code to an event (typically change):
#app/assets/javascripts/application.js
$(document).on("change", "select#form_item", function(e){
$(this).attr("data-option-value", $(this).val()); // this sets the "data-option-value" to the value
});
Perhaps this isn't the context in which you intended; it should give you the ability to dynamically assign the relative value to the field.
In my MVC3 application, I have a view model that I Json encode so I can manipulate it in JavaScript.
So let's say I have the following code:
var model=#Html.Raw(Json.Encode(Model));
Currently, model.Name has value "Name".
What I want to do now is create another JavaScript object "obj" that has a field called "Value". When you change obj.Value, it also changes model.Name.
So I want something like:
var obj=new Object();
obj.Value=model.Name;
So right now, if I change the value of obj.Value, it doesn't also change model.Name. I want that to happen and I'm not sure how I can do it in JavaScript. How do I do implement that?
Why don't just just put the name in a hidden input field. Change the value with whatever JavaScript you choose in the usual way. Then when the form is posted back you can bind to the name value in the controller action, and set the Model name server-side.
What you are attempting is unnecessarily complicated.
If you really wanted to make it work - then on submit put the entire JSON string in a hidden input field. Then again in the controller action bind to the JSON as a string and deserialize it server-side to reconstruct your Model.