How to get input field value without submitting the form

Question

I have a payment form in which user will input the amount in an input text field. I have another text field of the same form in which amount in words of the amount given by the user will be automatically written. But i am having problem that how i can extract the value of the field and pass it to the function which will convert the value. Please help me. This is the field where user will give input.

<div class="control-group form-group" style="padding-left:20px; padding-right: 20px;">
                        <div class="controls">
                            <label>Amount</label>
                            <input type="email" class="form-control" name="amount" id="amount" placeholder="Please enter amount"required/>
                        </div>
                    </div>

I have this field where the price should be written automatically. I have tried many ways but failed.

<div class="control-group form-group" style="padding-left:20px; padding-right: 20px;">
                        <div class="controls">
                            <label>Amount in words</label>
                            <input type="email" class="form-control" name="amountInWords" id="amountInWords" placeholder="Amount in words" value="<?php echo  ?>">
                        </div>
                    </div>

use keyup event of the textbox to copy value from textbox1 to textbox2 — chirag satapara, Aug 01 '17 at 04:59
He want `amount in words` in another textbox , not the same value — chirag satapara, Aug 01 '17 at 05:01
@NidaAkram , check this plugin.:http://www.jqueryscript.net/demo/jQuery-Plugin-To-Convert-Numbers-Into-Words-num2words/ — chirag satapara, Aug 01 '17 at 05:03
@NidaAkram , can you accept the answer so it will helpfull to others — chirag satapara, Aug 01 '17 at 09:11

S Dhanissh · Answer 1 · 2017-08-01T05:10:32.267

Updated try this

function convertNumberToWords(amount) {
    var words = new Array();
    words[0] = '';
    words[1] = 'One';
    words[2] = 'Two';
    words[3] = 'Three';
    words[4] = 'Four';
    words[5] = 'Five';
    words[6] = 'Six';
    words[7] = 'Seven';
    words[8] = 'Eight';
    words[9] = 'Nine';
    words[10] = 'Ten';
    words[11] = 'Eleven';
    words[12] = 'Twelve';
    words[13] = 'Thirteen';
    words[14] = 'Fourteen';
    words[15] = 'Fifteen';
    words[16] = 'Sixteen';
    words[17] = 'Seventeen';
    words[18] = 'Eighteen';
    words[19] = 'Nineteen';
    words[20] = 'Twenty';
    words[30] = 'Thirty';
    words[40] = 'Forty';
    words[50] = 'Fifty';
    words[60] = 'Sixty';
    words[70] = 'Seventy';
    words[80] = 'Eighty';
    words[90] = 'Ninety';
    amount = amount.toString();
    var atemp = amount.split(".");
    var number = atemp[0].split(",").join("");
    var n_length = number.length;
    var words_string = "";
    if (n_length <= 9) {
        var n_array = new Array(0, 0, 0, 0, 0, 0, 0, 0, 0);
        var received_n_array = new Array();
        for (var i = 0; i < n_length; i++) {
            received_n_array[i] = number.substr(i, 1);
        }
        for (var i = 9 - n_length, j = 0; i < 9; i++, j++) {
            n_array[i] = received_n_array[j];
        }
        for (var i = 0, j = 1; i < 9; i++, j++) {
            if (i == 0 || i == 2 || i == 4 || i == 7) {
                if (n_array[i] == 1) {
                    n_array[j] = 10 + parseInt(n_array[j]);
                    n_array[i] = 0;
                }
            }
        }
        value = "";
        for (var i = 0; i < 9; i++) {
            if (i == 0 || i == 2 || i == 4 || i == 7) {
                value = n_array[i] * 10;
            } else {
                value = n_array[i];
            }
            if (value != 0) {
                words_string += words[value] + " ";
            }
            if ((i == 1 && value != 0) || (i == 0 && value != 0 && n_array[i + 1] == 0)) {
                words_string += "Crores ";
            }
            if ((i == 3 && value != 0) || (i == 2 && value != 0 && n_array[i + 1] == 0)) {
                words_string += "Lakhs ";
            }
            if ((i == 5 && value != 0) || (i == 4 && value != 0 && n_array[i + 1] == 0)) {
                words_string += "Thousand ";
            }
            if (i == 6 && value != 0 && (n_array[i + 1] != 0 && n_array[i + 2] != 0)) {
                words_string += "Hundred and ";
            } else if (i == 6 && value != 0) {
                words_string += "Hundred ";
            }
        }
        words_string = words_string.split("  ").join(" ");
    }
    return words_string;
}

<div class="control-group form-group" style="padding-left:20px; padding-right: 20px;">
                        <div class="controls">
                            <label>Amount</label>
                            <input type="email" class="form-control" name="amountInWords" id="amountInWords" placeholder="Amount in words" onkeyup="amount.innerHTML=convertNumberToWords(this.value)">
                        </div>
                    </div>
                    
<div id="amount"></div>

Your question seem's blind, show your sample code, Anyhow you can do it by Jquery,

Jquery to get value of the field:

  var ExtractedValue = $('#YourFieldID').val();

Must include Jquery library before using this.

but then how i will pass that value to the function which converts the value. I tried this too but was failed. — Nida Akram, Aug 01 '17 at 04:58

chirag satapara · Answer 2 · 2017-08-01T05:13:46.993

Use this plugin for convert value into the amount.:http://www.jqueryscript.net/text/jQuery-Plugin-To-Convert-Numbers-Into-Words-num2words.html

Here is sample code of this plugins.

$(document).ready(function() {
   $('#num').focus();
   $('#demo').num2words();
}); 
$('#demo').num2words({
  units: [ "", "One", "Two", "Three", "Four", "Five", "Six","Seven", "Eight", "Nine", "Ten" ],
  teens: [ "Eleven", "Twelve", "Thirteen", "Fourteen", "Fifteen","Sixteen", "Seventeen", "Eighteen", "Nineteen", "Twenty" ],
  tens: [ "", "Ten", "Twenty", "Thirty", "Forty", "Fifty", "Sixty","Seventy", "Eighty", "Ninety" ],
  othersIntl: [ "Thousand", "Million", "Billion", "Trillion" ]
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="https://www.jqueryscript.net/demo/jQuery-Plugin-To-Convert-Numbers-Into-Words-num2words/jquery.num2words.js"></script>

<div id="demo">
  Enter amount: $ <input id="num" type="text">
  <input id="trans" type="button" value="Convert to words">
  <div></div>
</div>

Hope this answer is helpful to you.

How to get input field value without submitting the form

2 Answers2