به دست آوردن مقدار یک فیلد از ردیف بعدی جدول با استفاده از jquery یا js

[resident]

سلام.
وقتی یک ردیف از جدول را ویرایش می کنم، index آن سطر را دارم. حالا می‌خواهم مقدار یک فیلد را از ردیف بعدی (مانند Item_Percentage) به دست بیارم.
من کد زیر را نوشتم اما همیشه undefined برمی گردد.
لطفا راهنمایی کنید.
توجه: ممکن است index سطرها متوالی نباشد

https://jsfiddle.net/L4froxty/1/

جدول:

<table id="Itemdatatable" class="table table-striped table-hover">        

            <thead>            

            <tr>                

                <th>Row</th>

                <th>Col1</th>                

                <th>Col2</th>  

        <th> operation </th>          

            </tr>        

            </thead>        

                <tbody>                

                    <tr>                                        

                        <input id="Items_Index" name="Items.Index" type="hidden" value="0">

                        <input name="Items[0].Item_InvoiceID" type="hidden" value="41446">                        

                        <input name="Items[0].Item_StoreID" type="hidden" value="6">

                        <input name="Items[0].Item_Percentage" type="hidden" value="0">                    

                        <td> 1 </td>   

                        <td> aaaa </td>

                        <td> bbbb </td>

        <td> <a href="#" onclick="EditItemRow(0)">Edit</a> </td>                  

                    </tr>

             

             

                    <tr>                                        

                        <input id="Items_Index" name="Items.Index" type="hidden" value="1">                    

                        <input name="Items[1].Item_InvoiceID" type="hidden" value="55546">                        

                        <input name="Items[1].Item_StoreID" type="hidden" value="13">

    <input name="Items[1].Item_Percentage" type="hidden" value="10">                    

                        <td>2</td>

                        <td>cccc</td>

                        <td>ddd</td>   

        <td><a href="#" onclick="EditItemRow(1)">Edit</a></td>                  

                    </tr>                

                         

                </tbody>    

            </table>

        

        

        

            function EditItemRow(rowIndex)

            {

             var currentRow = $('table#Itemdatatable').find('tr').eq(rowIndex);

            var nextRowIndex = $(currentRow).next().find('input[name="Items.Index"]').val();

           var percent = $('input[name="Items[' + nextRowIndex + '].Item_Percentage"]').val();

    alert(percent);

            }

[mazoolagh]

سلام و روز خوش

1- شما یک tr هم در thead دارین که اون هم حساب میشه،
باید از tbody شروع کنین.

2- اون next هم پوینتر رو میبره رو tr بعدی و نباید باشه:

با استفاده از jQuery

        function EditItemRow(rowIndex) {

            const percent = $('#Itemdatatable tbody tr').eq(rowIndex)

                .find($('input[name$="Item_Percentage"]')).val();

            alert(percent);

        }

        function EditItemRow(rowIndex) {

            const percent = $(`input[name$="Items[${rowIndex}].Item_Percentage"]`).val();

            alert(percent);

        }

جاوااسکریپت خالص

function EditItemRow(rowIndex) {

    const currentRow=document.querySelectorAll("#Itemdatatab  le tbody tr")[rowIndex];

    const percent = currentRow.querySelector('input[name$="Item_Percentage"]').value;

    alert(percent);

}

        function EditItemRow(rowIndex) {

            const percent = document.querySelector(`input[name$="Items[${rowIndex}].Item_Percentage"]`).value;

            alert(percent);

        }

[mazoolagh]

یک راه دیگه این هست که اصلا rowIndex استفاده نکنین،
و از روی activeElement (که اینجا المان a هست)، tr رو پیدا کنین:

        function EditItemRow() {

            const currentRow = document.activeElement.parentElement.parentElement  ;

            const percent = currentRow.querySelector('input[name$="Item_Percentage"]').value;

            alert(percent);

        }

    <table id="Itemdatatable" class="table table-striped table-hover">

        <thead>

            <tr>

                <th>Row</th>

                <th>Col1</th>

                <th>Col2</th>

                <th> operation </th>

            </tr>

        </thead>

        <tbody>

            <tr>

                <input id="Items_Index" name="Items.Index" type="hidden" value="0">

                <input name="Items[0].Item_InvoiceID" type="hidden" value="41446">

                <input name="Items[0].Item_StoreID" type="hidden" value="6">

                <input name="Items[0].Item_Percentage" type="hidden" value="0">

                <td> 1 </td>

                <td> aaaa </td>

                <td> bbbb </td>

                <td> <a href="#" onclick="EditItemRow()">Edit</a> </td>

            </tr>

            <tr>

                <input id="Items_Index" name="Items.Index" type="hidden" value="1">

                <input name="Items[1].Item_InvoiceID" type="hidden" value="55546">

                <input name="Items[1].Item_StoreID" type="hidden" value="13">

                <input name="Items[1].Item_Percentage" type="hidden" value="10">

                <td>2</td>

                <td>cccc</td>

                <td>ddd</td>

                <td><a href="#" onclick="EditItemRow()">Edit</a></td>

            </tr>

        </tbody>

    </table>

[mazoolagh]

پ.ن:

الان این داکیومنت html سمت سرور ایجاد شده؟

اگر اینجور هست و خودتون هم میسازین چند نکته به نظر میاد:

1- برای یک سری از inputها از id یکسان استفاده شده: Items_Index
البته تا زمانی که نرین سراغش مشکلی ایجاد نمیکنه - ولی به هر حال نادرسته.

2- میتونین برای inputها به جای name از id و با عبارتهای ساده تر استفاده کنین،
این به کدنویسی ساده تر منجر میشه:

Percentage_00

InvoiceID_25

[resident]

سلام و روز خوش

1- شما یک tr هم در thead دارین که اون هم حساب میشه،
باید از tbody شروع کنین.

2- اون next هم پوینتر رو میبره رو tr بعدی و نباید باشه:

با استفاده از jQuery

        function EditItemRow(rowIndex) {

            const percent = $('#Itemdatatable tbody tr').eq(rowIndex)

                .find($('input[name$="Item_Percentage"]')).val();

            alert(percent);

        }

ممنون از زمانی که گذاشتین و به صورت کامل کدها رو گذاشتین

بنده میخوام مقدار Item_Percentage مربوط به ردیف بعدی رو بخونم نه همون ردیفی که روش کلیک شده.

[mazoolagh]

پس کافی هست از rowindex+1 استفاده کنین.

فقط حواستون به آخرین tr باشه!
الان وضعیتش مشخص نیست که کدوم item_percentage رو باید بگیره.

[resident]

مشکل همین جاست که ایندکس‌ها به صورت متوالی نیستند

[mazoolagh]

مشکل همین جاست که ایندکس‌ها به صورت متوالی نیستند

خب نمونه ای که گذاشتین این رو نشون نمیده!

خوبه که همین الان یک موردی رو مشخص کنین چون مبهم هست:
منظور از ردیف بعدی آیا tr بعدی هست،
یا rowindex بعدی (ولی این rowindex+1 میتونه در هر trی باشه)؟

نمونه رو گسترش بدین تا مشخص باشه.
و تکلیف آخرین tr هم باید مشخص باشه.