Home > Blockchain >  how can i get values from input and show them in table modal?
how can i get values from input and show them in table modal?

Time:08-31

I want to get all values in 'input' and show them in the modal table using js. How can i do that? My script:

<script>
            $(document).ready(function() {
                $(document).on('click', '.save', function() {
                var id = $(this).val();
                var name = $('#name'   id).val();
                $('#edit').modal('show');
                $('#sname').val(name);
                });
            });
</script>

My modal

 <!-- The Modal -->
            <div  id="edit">
                <div >
                    <div >
                    <!-- Modal Header -->
                        <div >
                            <h4>If you are sure of the information you entered, press the "OK" button</h4>
                        </div>
                    <!-- Modal body -->
                        <div  >
                            <table >
                                <tbody>
                                    <tr>
                                        <th scope="row">Full name</th>
                                        <td>
                                             <input  id="sname">
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
       
                        <!-- Modal footer -->
                        <div >
                            <button type="submit" name="action"  onclick="return validateForm();" value="Save" >OK</button>
                            <button type="button"  data-dismiss="modal">Back</button>
                        </div>
                        </div>
                    </div>
                </div>
            </div>

Form to input data

<s:form name="myForm" action="saveProcess" items="${employeeList}" var="e" modelAttribute="employee" style="margin-top: 100px;" onsubmit="return validateForm()">
            <div >
                <s:input type="hidden" path="id" placeholder="Enter Id" />
            </div>
            <div >
                <label>Full name</label>
                <s:input path="fullname" type="text" id="name" placeholder="Enter Fullname"  name="fullname" style="width: 500px; margin-top:-39px; margin-left: 150px"/>       
            </div>
            
            <div >
                <button  onclick="return validateForm();" type="button"  style="position: relative; left: 200px; border-radius: 8px"  >
                    Save
                </button>
            </div>
        </s:form>
  

Now, when i entered data in input and clicked btn save, instead of using input, how can i use label, td,...????

CodePudding user response:

Hard to parse your question exactly, but I think this is what you mean to do? just give a unique id or class to the td, then modify its contents using html().

javascript

$( '#label_td' ).html( name );

html

<tr>
    <th scope="row">Full name</th>
    <td id="label_td"></td>
</tr>
  • Related