Question posted in
You can find the official documentation here.

Jquery How to select ul inside td of selected row – Jquery ajax

How to select <ul> inside <td> of selected row.
here is my html and jquery code.
Help me to resolve this issue.

I am trying to select <ul> tag inside <td> to insert fetched data by ajax.

this is jquery code.

 $('.result').click(function () {
            var tpid = $(this).parents('tr').find('.tpId').val();
            $.ajax({
                    type: "POST",
                    url: "/Reception/PatientTests/getHelpValue",
                    data: { 'tpid': tpid },
                success: function (data) {
                    str = "";
                    for (var i = 0; i < data.length; i++) {
                        str +="<li>"+data[i] + "</li>";
                    }
                    $(this).find('td ul').html(str);
                },
                    error: function (e) {
                        alert('Error' + JSON.stringify(e));
                    }
            });

        });

this is my html code.

<table class="table table-bordered table-sm" style="height:auto">
                                    <tbody><tr class="blue-gradient-rgba text-white">
                                        <th>Test Name</th>
                                        <th>Value</th>
                                        <th>Unit</th>
                                        <th>Normal</th>
                                        <th>Minimum</th>
                                        <th>Maximum</th>
                                    </tr>

                                        <tr>
                                                <input type="hidden" class="tid" value="2">
                                                <th colspan="2">COMPLETE BLOOD COUNT</th>
                                        </tr>
                                                <tr>
                                                    <td>Haemoglobin</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="9">
                                                    <input type="text" class="result" value="45">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>gm %</td>
                                                    <td>m-14.0 to 18.0 Gms. %
F- 12.5 to 16.0 Gms. %</td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    <td>MCV</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="12">
                                                    <input type="text" class="result" value="75">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>fl</td>
                                                    <td>76- 96</td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                        <tr>
                                                <input type="hidden" class="tid" value="3">
                                                <th colspan="2">DENGUE IgG /IgM</th>
                                        </tr>
                                                <tr>
                                                    <td>Dengue IgG</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="13">
                                                    <input type="text" class="result" value="53">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>ml</td>
                                                    <td></td>
                                                    <td>1 mL serum</td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    <td>Dengue IgM</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="14">
                                                    <input type="text" class="result">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>ml</td>
                                                    <td></td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    <td>Dengue NS1</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="15">
                                                    <input type="text" class="result">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>ml</td>
                                                    <td></td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>

                                </tbody></table>

I tried this $(this).find('td ul').html(str); but it’s not working.
here I want to add data into ul of the particular row.

Tags:

2

Answers


  1. 0

    .tpId is just previous and ul is just next to the .result. So, you can use prev and next:

    var tpid = $(this).parents('tr').find('.tpId').val();
// Alternative:
var tpid = $(this).prev().val(); // I love this approach

// This is wrong
$(this).find('td ul').html(str);
// You're finding from `.result`
// So, use:
$(this).parents('tr').find('ul').html(str);
// But, you can do just
$(this).next().html(str); // I love this approach
    Login or Signup to reply.
  2. 0

    As far as my understanding, you try to access ‘ul’, inside of your ‘td’. Here is the block of code which includes ul inside of td.

     <tr>
      <td>MCV</td>
      <td>
          <input type="hidden" class="tpId" value="12">
          <input type="text" class="result" value="75">
          <ul class="helpValues"></ul>
       </td>
       <td>fl</td>
       <td>76- 96</td>
       <td></td>
       <td></td>
       </tr>

    Jquery code 

    
$(".result").on("click",function()
{

let ul=$(this).parent().find("ul");
let ulValues=$(ul).val();

console.log(ulValues);


})
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search