[AngularJS] Re: Backloading an Angular js form
Hi, Peter. Which version of Angular are you using? Could you send your code so that we can take a look? On Saturday, October 15, 2016 at 10:01:19 PM UTC-3, Peter Cawdron wrote: > > Hi, > > I'm new to Angular. I've got an Angular js form that has rendered and > works properly (updates, etc). I have a scenario where I want to populate > form values based on user action. So if the user takes a certain action, a > value in a dropdown box, checkbox, input, etc, is set in a certain way. I > can get everything working except the last step. > > From javascript, how do I update the data displayed on the form? > > I've gone so far as to use document.getElementById('123').value = 'my new > default' and although that works for plain text input fields, it doesn't > change things like select dropdown boxes. They accept the new value, but > still display a blank value. Is there any easy way to do this through the > Angular framework? > > Thanks, > Peter > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Backloading an Angular js form
Hi Hugo, My problem ended up being the result of combining AngularJS and bootstrap. The solution was to update both, so I've used //Update angular values $scope.data.mydata["IO:"+ array-cycling-through-fields ].value = newValue; //Update browser so the change in data is visible to the user document.getElementById("IO:" + array-cycling-through-fields ) = newValue; //The challenge is Bootstrap does some fancy 'magic' when it comes to select boxes, using labels to hold values, so these have to be updated as well or the dropdown appears not to change its value var alternativeHTML = document.getElementsByName("IO:" + array-cycling-through-fields )[0]; if(alternativeHTML.tagName == 'SELECT'){ alternativeHTML.previousSibling.childNodes[0].childNodes[0].nextElementSibling.innerHTML = newValue; } Cheers, Peter On Monday, October 17, 2016 at 3:35:57 AM UTC+10, Hugo Arthur Amaral wrote: > > Hi, Peter. > > Which version of Angular are you using? > Could you send your code so that we can take a look? > > > On Saturday, October 15, 2016 at 10:01:19 PM UTC-3, Peter Cawdron wrote: >> >> Hi, >> >> I'm new to Angular. I've got an Angular js form that has rendered and >> works properly (updates, etc). I have a scenario where I want to populate >> form values based on user action. So if the user takes a certain action, a >> value in a dropdown box, checkbox, input, etc, is set in a certain way. I >> can get everything working except the last step. >> >> From javascript, how do I update the data displayed on the form? >> >> I've gone so far as to use document.getElementById('123').value = 'my new >> default' and although that works for plain text input fields, it doesn't >> change things like select dropdown boxes. They accept the new value, but >> still display a blank value. Is there any easy way to do this through the >> Angular framework? >> >> Thanks, >> Peter >> > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Backloading an Angular js form
Ok, Peter, I'm glad your problem was resolved. However, I think you could use only Angular to resolve this problem. On Monday, October 17, 2016 at 12:06:48 AM UTC-2, Peter Cawdron wrote: > > Hi Hugo, > > My problem ended up being the result of combining AngularJS and bootstrap. > The solution was to update both, so I've used > > //Update angular values > $scope.data.mydata["IO:"+ array-cycling-through-fields ].value = newValue; > > //Update browser so the change in data is visible to the user > document.getElementById("IO:" + array-cycling-through-fields ) = newValue; > > //The challenge is Bootstrap does some fancy 'magic' when it comes to > select boxes, using labels to hold values, so these have to be updated as > well or the dropdown appears not to change its value > var alternativeHTML = document.getElementsByName("IO:" > + array-cycling-through-fields )[0]; > if(alternativeHTML.tagName == 'SELECT'){ > alternativeHTML.previousSibling.childNodes[0].childNodes[0].nextElementSibling.innerHTML > > = newValue; > } > > > Cheers, > Peter > > > > > > > On Monday, October 17, 2016 at 3:35:57 AM UTC+10, Hugo Arthur Amaral wrote: >> >> Hi, Peter. >> >> Which version of Angular are you using? >> Could you send your code so that we can take a look? >> >> >> On Saturday, October 15, 2016 at 10:01:19 PM UTC-3, Peter Cawdron wrote: >>> >>> Hi, >>> >>> I'm new to Angular. I've got an Angular js form that has rendered and >>> works properly (updates, etc). I have a scenario where I want to populate >>> form values based on user action. So if the user takes a certain action, a >>> value in a dropdown box, checkbox, input, etc, is set in a certain way. I >>> can get everything working except the last step. >>> >>> From javascript, how do I update the data displayed on the form? >>> >>> I've gone so far as to use document.getElementById('123').value = 'my >>> new default' and although that works for plain text input fields, it >>> doesn't change things like select dropdown boxes. They accept the new >>> value, but still display a blank value. Is there any easy way to do this >>> through the Angular framework? >>> >>> Thanks, >>> Peter >>> >> -- You received this message because you are subscribed to the Google Groups "Angular" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Backloading an Angular js form
*https://www.youtube.com/watch?v=Al9bmstjUjc* On Sunday, October 16, 2016 at 3:01:19 AM UTC+2, Peter Cawdron wrote: > > Hi, > > I'm new to Angular. I've got an Angular js form that has rendered and > works properly (updates, etc). I have a scenario where I want to populate > form values based on user action. So if the user takes a certain action, a > value in a dropdown box, checkbox, input, etc, is set in a certain way. I > can get everything working except the last step. > > From javascript, how do I update the data displayed on the form? > > I've gone so far as to use document.getElementById('123').value = 'my new > default' and although that works for plain text input fields, it doesn't > change things like select dropdown boxes. They accept the new value, but > still display a blank value. Is there any easy way to do this through the > Angular framework? > > Thanks, > Peter > -- You received this message because you are subscribed to the Google Groups "Angular" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.