how to get javascript function paramater value in input field

Question

var tbl = document.getElementById("tblMain");
        if (tbl != null) {
            for (var i = 0; i < tbl.rows.length; i++) {
                for (var j = 0; j < tbl.rows[i].cells.length; j++)
                    tbl.rows[i].cells[j].onclick = function () { getval(this); };
            }
        }
 
        function getval(cel) {
            alert(cel.innerHTML);
        }

$("#tblMain  tbody td").on('click', function() {
    $("#empname").val($(this).text());
    
 
$("#empname").on(function () {
    if (this.value.length == this.maxLength) {
      $(this).next('#empname').focus();
    }
});

<table align="center" id="tblMain" border="1" style="cursor: pointer;">
        <tr>
            <td>
                1
            </td>
            <td>
                2
            </td>
            <td>
                3
            </td>
            <td>
                4
            </td>
        </tr>
        <tr>
            <td>
                5
            </td>
            <td>
                6
            </td>
            <td>
                7
            </td>
            <td>
               8
            </td>
        </tr>
        <tr>
            <td>
                9
            </td>
            <td>
                0
            </td>
            <td>
                R3C3
            </td>
            <td>
                R3C4
            </td>
        </tr>
        <tr>
            <td>
                R4C1
            </td>
            <td>
                R4C2
            </td>
            <td>
                R4C3
            </td>
            <td>
                R4C4
            </td>
        </tr>
    </table>
<input type="text" id="empname" maxlength="1">
<input  id="empname2" type="text" maxlength="1" />
cxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdzcxxxxxxxxxxxxxxxxxxxxxxxxfhdfxdzdzdzdzdzdzfdzffzdfzdzdzdzdzdz

What are we supposed to make out of the code, unless you explain what is the problem — ISHIDA
– ISHIDA, Commented Jun 13, 2017 at 21:42
i am trying to enter the value from number pad it is having four input field .for that i need a solution — tgn
– tgn, Commented Jun 13, 2017 at 21:43
var tbl = document.getElementById("tblMain"); if (tbl != null) { for (var i = 0; i < tbl.rows.length; i++) { for (var j = 0; j < tbl.rows[i].cells.length; j++) tbl.rows[i].cells[j].onclick = function () { getval(this); }; } } function getval(cel) { alert(cel.innerHTML); this alert messase is giving selected tr input vales as aletr but i wanted in the input field } $("#tblMain tbody td").on('click', function() { $("#empname").val($(this).text()); }); — tgn
– tgn, Commented Jun 13, 2017 at 21:45
alert messaging is giving the selected tr---1 etctill 9.but i dint want want alert message instead iwant to pass the valu in put field into four boesx as otp input — tgn
– tgn, Commented Jun 13, 2017 at 21:48

SactoJosh · Accepted Answer · 2017-06-13 22:38:49Z

1

You are missing a few end parenthesis and curly brackets. When you are debugging javascript, check the error console (by pressing F12 if in Chrome). Here is your javascript with the missing characters:

var tbl = document.getElementById("tblMain");
if (tbl != null) {
    for (var i = 0; i < tbl.rows.length; i++) {
        for (var j = 0; j < tbl.rows[i].cells.length; j++)
            tbl.rows[i].cells[j].onclick = function () { getval(this); };
    }
}

function getval(cel) {
    alert(cel.innerHTML);
}

$("#tblMain  tbody td").on('click', function() {
    $("#empname").val($(this).text());
});

$("#empname").on(function () {
    if (this.value.length == this.maxLength) {
      $(this).next('#empname').focus();
    }
});

You could honestly get rid of a lot of your Javascript code. Maybe you had all of the top stuff there just for testing? Or another form of assigning onclick handling? All you really need is the second half. The JQuery stuff. Although I'm not entirely sure what you are trying to do with the second one. https://jsfiddle.net/c5n4h9zu/1/

edited Jun 13, 2017 at 22:38

answered Jun 13, 2017 at 21:56

SactoJosh

3761 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

21 Comments

tgn Over a year ago

ya thankyou but while i am copying to this forum i missed it but i want function getval(cel) { alert(cel.innerHTML); } alert message value needs to be pass into the input field?can you tell me how we can pass that>\?

SactoJosh Over a year ago

I created a JSFiddle for you to check out. It works. You click a button and the number goes into the input field. I'm not sure what else you are hoping it will do. Go to the jsfiddle link I added and check it out.

tgn Over a year ago

this is what exactly i am tring to do this is sample link codepen.io/christiancoan/pen/PNyWWe.but i am dong throug table tr buttons

SactoJosh Over a year ago

Why not just use the code shown on that page? You can just change the look of the buttons if you don't want circles. What you're asking is already done for you on that sample page.

tgn Over a year ago

i wanted in tables tr as a button..?

|

score 0 · Accepted Answer · 2017-06-14 14:22:34Z

0

var toggle = "#empname";

$("#tblMain  tbody td").on('click', function() {
    switch (toggle) {
    	case "#empname":
      	$(toggle).val($(this).text());
      	toggle = "#empname2";
      	break;
      case "#empname2":
      	$(toggle).val($(this).text());
      	toggle = "#empname3";
      	break;
      case "#empname3":
      	$(toggle).val($(this).text());
      	toggle = "#empname4";
      	break;
      case "#empname4":
      	$(toggle).val($(this).text());
      	toggle = "#empname";
      	break;
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table align="center" id="tblMain" border="1" style="cursor: pointer;">
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
  </tr>
  <tr>
    <td>9</td>
    <td>0</td>
    <td>R3C3</td>
    <td>R3C4</td>
  </tr>
  <tr>
    <td>R4C1</td>
    <td>R4C2</td>
    <td>R4C3</td>
    <td>R4C4</td>
  </tr>
 </table>
 
<input type="text" id="empname" value=""/>
<input type="text" id="empname2" value=""/>
<input type="text" id="empname3" value=""/>
<input type="text" id="empname4" value=""/>

What you could do (if I am understanding your question correctly), is add the onclick event handlers for each number. The code they would run would set the .value property of the inputs to the respective number pressed. Hope this helps.

edited Jun 14, 2017 at 14:22

answered Jun 13, 2017 at 22:10

user8155415

11 Comments

tgn Over a year ago

yes Exactly your right.if possible give me solution for that thanks in advance

user8155415 Over a year ago

No problem. Give me a couple minutes and I will respond back. P.S. What is the problem with the JSfiddle made above by SactoJosh? Just so I can improve it. Thanks. It might take a bit longer actually. Will try to do it as fast as I can.

tgn Over a year ago

actully it displays the clicked tr as alert and passing into one input field 2.but when i click the another tr it again pass the value into same input firld but it needs to be pass in other input field like otp form.it is not passing into other input field.four input filed need to pass when i m clicking thre tr by using auto focus

user8155415 Over a year ago

OK. Instead of using autofocus, I will make it automatically know when to switch to the next input box. Would this be fine? P.S. I will edit my original response and add in the code for it.

user8155415 Over a year ago

Or do you still need my help?

|

Collectives™ on Stack Overflow

how to get javascript function paramater value in input field

2 Answers 2

21 Comments

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

21 Comments

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related