0

I am trying to implement an input text field where the $ dollar sign should appear in textbox. when user enters value this dollar symbol should remain there and act as a part of value that I will get from text box. Since the app is angular I can retrieve input value or display piped value in it. But I need the dollar sign or currency sign to be in the text box and user needs to enter value in tat text box. On entering the $ sign should remain there and in backend I need to get something like $500. 

<div ng-app="myApp" ng-controller="costCtrl">
    <p>Price = {{ price | currency }}</p>
    <input type="text" ng-model="price | currency"/>
</div>

I am attaching image for the input box the way I want it to look so that user value entered is next to dollar sign.

enter image description here

georgeawg
  • 48,608
  • 13
  • 72
  • 95
SAM
  • 27
  • 7
  • http://jsfiddle.net/ose4r8uj/405/ – baao Jun 19 '18 at 21:01
  • Possible duplicate of [Put icon inside input element in a form](https://stackoverflow.com/questions/917610/put-icon-inside-input-element-in-a-form) – Max Baldwin Jun 19 '18 at 21:01
  • I don't need to put the icon inside text box... its a $ symbol which will be sent to backend in concatenation to what user enters number. – SAM Jun 19 '18 at 21:10
  • if the symbol is actually part of the value of the input field, then there is nothing stopping the user from deleting it. as a result, you might be better served by putting the icon in the input element (not as part of the `value`), and then adding the "$" to the value somewhere else in your chain, either before making the AJAX call or in the backend. – Mike K Jun 19 '18 at 23:03
  • @georgeawg It doesnot generate error rather gets an output of $1500. – SAM Jun 20 '18 at 12:18

0 Answers0