Question

138

How to display the values from ajax success data to the html table?

rated 0 times [ 145] [ 7] / answers: 1 / hits: 6162 / 4 Years ago, tue, february 25, 2020, 12:00:00

I need to view the ajax success message in my html table
my cshtml code is:

@*@{Customer.Models.Customers cust = ViewBag.Customers;

}*@

@{ 

            }



    <center><h1 style=color:red>User details</h1></center>



<div>

    <table class=table>



        <tr>

            <td>ID</td>

            <td>res.Id</td>

        </tr>

        <tr>

            <td>FIRST NAME</td>

            <td>res.Fname</td>

        </tr>

        <tr>

            <td>LAST NAME</td>

            <td>res.Lname</td>

        </tr>

        <tr>

            <td>LOCATION</td>

            <td>res.Location</td>

        </tr>

        <tr>

            <td>Contact</td>

            <td>res.Contact</td>

        </tr>

        <tr>

            <td>Email</td>

            <td>res.Email</td>

        </tr>

        <tr>

            <td>Password</td>

            <td>res.Password</td>

        </tr>

        <tr>

            <td>Role</td>

            <td>res.Category</td>

        </tr>

        <tr>



    </table>

</div>

@section Scripts{

    <script>

            $.ajax({

                contentType: application/json,

                type: GET,

                url: https://localhost:44397/api/Values/Details/ + id,

                success: function (data) {

                    alert('Welcome!');

                    res = data;





                   // window.location.href = /Home/Details/ + data.id;

                },

                error: function (jqXHR, textStatus, errorThrown) {

                    $(#postResult).val(jqXHR.statusText);

                }

            });

    </script>

}

Is there any way to use the success data to pass in the each table row?
That is I want the res to store the success data and then pass it to the table fields like res.Fname (eg) and it should display the data accordingly.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

isham

Add To Favorites

Follow

Total Points: 69

Total Questions: 86

Total Answers: 86

Location: Anguilla

Member since Sun, Jan 29, 2023

1 Year ago

isham questions

1 NodeJS - TypeError: Busboy is not a constructor

Wed, Jan 19, 22, 00:00, 2 Years ago

1 How to pass query parameters to next.js api handler when calling from inside of getStaticProps

Wed, Dec 2, 20, 00:00, 4 Years ago

1 How to set expanded prop for material ui TreeView component conditionally

Tue, Feb 4, 20, 00:00, 4 Years ago

1 Getting Firebase doc.data is undefined

Sun, Dec 1, 19, 00:00, 5 Years ago

1 Firebase firestore timestamp to Formatted Date

Tue, Nov 26, 19, 00:00, 5 Years ago

View All

answered 4 Years ago daveon · Accepted Answer

If you need to show value in one column alone then use this type

@*@{Customer.Models.Customers cust = ViewBag.Customers;

}*@

@{ 

            }



    <center><h1 style=color:red>User details</h1></center>



<div>

    <table class=table>



        <tr>

            <td>ID</td>

            <td id=Id></td>

        </tr>

        <tr>

            <td>FIRST NAME</td>

            <td id=Fname></td>

        </tr>

        <tr>

            <td>LAST NAME</td>

            <td id=Lname></td>

        </tr>

        <tr>

            <td>LOCATION</td>

            <td id=Location></td>

        </tr>

        <tr>

            <td>Contact</td>

            <td id=Contact></td>

        </tr>

        <tr>

            <td>Email</td>

            <td id=Email></td>

        </tr>

        <tr>

            <td>Password</td>

            <td id=Password></td>

        </tr>

        <tr>

            <td>Role</td>

            <td id=Category></td>

        </tr>

        <tr>



    </table>

</div>

@section Scripts{

    <script>

            $.ajax({

                contentType: application/json,

                type: GET,

                url: https://localhost:44397/api/Values/Details/ + id,

                success: function (data) {

                    alert('Welcome!');

                    res = data;

                    document.getElementById(Id).innerHTML = res.Id;

                    document.getElementById(Fname).innerHTML= res.Fname;

                    document.getElementById(Lname).innerHTML= res.Lname;

                    document.getElementById(Location).innerHTML= res.Location;

                    document.getElementById(Contact).innerHTML= res.Contact;

                    document.getElementById(Email).innerHTML= res.Email;

                    document.getElementById(Password).innerHTML= res.Password;

                    document.getElementById(Category).innerHTML= res.Category;

                   // window.location.href = /Home/Details/ + data.id;

                },

                error: function (jqXHR, textStatus, errorThrown) {

                    $(#postResult).val(jqXHR.statusText);

                }

            });

    </script>

}

I think it will help you :)