I an new to AngularJS.
Below is my try to append text value in textarea with Laravel.
<textarea class="form-control" name="eticket" ng-model="{{ $var[0]['info'] }}"></textarea>
But it is generate error like this.
Thanks in advance.
There is a syntax error in your expression .You dont need to pass curly braces in ng-model . ng-model is angular js directive and you can directly pass value like :
<textarea class="form-control" name="eticket" ng-model="$var[0]['info']">
Related
I have created dynamic form, here I want to send form data to controller. How can do this?
Here is plunker code link https://plnkr.co/edit/xmxDJHTPfJoSFwa2FWCB?p=preview
Issues:
when I change the value then element label also change.
How can I get the form data in product_submit function of controller.
All response appreciated.
Use
<input type="text"
id="module_module"
ng-model="getCol.value"
required="required"
class="form-control col-md-7 col-xs-12"
placeholder="Enter {{getCol.Field}}"
/>
Look here ng-model="getCol.value". You are using filed name as text field model value. Filed name and value are different. That is what you want I suppose.
You can access the values easily from your controller as $scope.getColumn[1].value. Change index or iterate accordingly.
Plunker here
To solve label issues, in your html, I changed ng-model expression to bound into getColumn.Value
In controller, I can read value entered in scope.getColumn[i].Value
I also updated code https://plnkr.co/edit/KlhAb69seMzHsLuhqweR?p=preview
I'm trying to use the 720Kb datepicker.
https://github.com/720kb/angular-datepicker
While using the simple example :
<datepicker>
<input ng-model="date" type="text"/>
</datepicker>
I'm getting the blow error:
angular.js:11655 Error: [$compile:multidir] Multiple directives
[datepicker, datepicker] asking for new/isolated scope on:
http://errors.angularjs.org/1.3.15/$compile/multidir?p0=datepicker&p1=datep…epicker%20class%3D%22datepicker%22%20date-format%3D%22dd%2FMM%2Fyyyy%22%3E
at angular.js:63
I noticed that if I'm changing the name of the directive in the src file for example to datepickercust the above example will work (with changing the tags).
<datepickercust >
<input ng-model="date" type="text"/>
</datepickercust>
Also , if I'm trying the same example by changing the 'datepicker' tags to 'div' tags , and adding class='datepicker' it works fine.
<div class="datepicker">
<input ng-model="date" type="text"/>
</div>
I just can't understand what's going on here... why the original example not working ?
Thanks in advance.
Check if there are two datepicker directives with the same name and do check what formation they allow like tag, element or attribute etc.
Issue found.
Looks like UI Bootstrap still contain 'datepicker' directive which is deprecated and causing this issue .
Now need to see how I can work with both .
Thanks all.
I am trying to do validation with angular and Bootstrap but for some reasons ng-pattern validation is not working in Zip Code. Any help will be great in this.
Here's FIDDLE LINK
Not able to paste full code, but here is how I am attempting to use the ng-pattern directive:
<input type="text" class="form-control" id="zipCode" name="zipCode"
ng-model="auth.zip" ng-pattern="^(\d{5}-\d{4}|\d{5})$" required="">
The problem is that when you place the pattern inline instead of a scope variable it expects / around the regex, like a litteral.
Like this:
/^(\d{5}-\d{4}|\d{5})$/
Fiddle
See the input docs, check out the arguments section then ngPattern
Hi you can use like this
$scope.zipNumbr = /^[0-9]{1,6}$/;
I have a form input with names containing brackets, e.g.:
<form name="my_form">
<input type="text" name="my_form[email]" ng-model="email" ng-class="'mycssclass': my_form.my_form[email].$invalid">
</form>
So, the problem is that Angular is not applying that css class because of the name of my input (my_form[email]), is that the correct notation to reference my input in Angular.
Here's is a plunk:
http://plnkr.co/edit/t7PEilV9maNYGnVYnTDc?p=preview
The way to reference an input with a name containing brackets is using brackets notation, like this:
my_form['my_form[email]'].$invalid
You need to use the ng-model attribute in your input. It bind the content of a field with a value in the $scope. You also need to pass a Javascript Object to the ng-class directive. In your example it would be :
<form name="my_form">
<input type="text" ng-model="my_form.email" ng-class="{'mycssclass': my_form.email.$invalid}">
</form>
Don't hesitate to look at the examples in the ng-model and ng-class directive documentation.
In angularjs,I want to get the value of the hidden input. such as the following:
<pre>
<input type="hidden" name="captId" value="AqXpRshs9QHfxUbOWqMT" ng-model="captId">
</pre>
How to get the "hidden input" value "AqXpRshs9QHfxUbOWqMT" by using angularjs,not ajax or jquery.
You can use ng-init to initialize the value so it binds that to your model variable upon creation.
<input type="hidden" name="captId" ng-init="captId='AqXpRshs9QHfxUbOWqMT'" ng-model="captId">
Or you can get it directly if all else fails:
angular.element(document.getElementsByName('captId')[0]).val();
// or dont use angular at all
document.getElementsByName('captId')[0].value
Documentation for angular.element
By ID
document.getElementById('yourId').value
By Name
document.getElementsByName('yourName')[0].value
Keep it simple :)