在ajax的帮助下将两个表连接起来后,我带来了一些数据,现在我需要在单击Submit按钮之后逐行提交那些数据。

Serial_no|member_id|member_name|account_no|General_saving|Dps|actions
 1       | 1111111 | zia       | 01010101 |100           |190|submit


 2       | 2222222 |shishir    | 02020202 |100           |200|submit


 3       | 3333333 | shohan    | 03030303 |100           |230|submit


我想单击提交按钮,将行数据发送到控制器到数据库。我的HTML代码如下所示:

<div class="col-md-12" style="background-color: #EAEAEA">
<div class="form-group col-md-12" id="form-MemberPresentAddress-error">
    <h3>Account Information</h3>
</div>
<table class="table table-bordered table-striped">
<thead>
<tr>
    <th width="50px" style="text-align: center">No</th>
    <th>
        <a href="javascript:ajaxLoad('posting/list?field=MemberId&sort=
{{Session::get("posting_sort")=="asc"?"desc":"asc"}}')">
            Member ID
        </a>
        <i style="font-size: 12px"
           class="glyphicon  {{ Session::get('posting_field')=='MemberId'?
(Session::get('posting_sort')=='asc'?'glyphicon-sort-by-
alphabet':'glyphicon-sort-by-alphabet-alt'):'' }}">
        </i>
    </th>
    <th>
        <a href="javascript:ajaxLoad('posting/list?field=MemberName&sort=
{{Session::get("posting_sort")=="asc"?"desc":"asc"}}')">
            Member Name
        </a>
        <i style="font-size: 12px"
           class="glyphicon  {{ Session::get('posting_field')=='MemberName'?
(Session::get('posting_sort')=='asc'?'glyphicon-sort-by-
alphabet':'glyphicon-sort-by-alphabet-alt'):'' }}">
        </i>
    </th>
     <th>
        <a href="javascript:ajaxLoad('posting/list?field=AccountNo&sort=
{{Session::get("posting_sort")=="asc"?"desc":"asc"}}')">
            Account No
        </a>
        <i style="font-size: 12px"
           class="glyphicon  {{ Session::get('posting_field')=='AccountNo'?
(Session::get('posting_sort')=='asc'?'glyphicon-sort-by-
alphabet':'glyphicon-sort-by-alphabet-alt'):'' }}">
        </i>
    </th>
    <th>
        <a href="javascript:ajaxLoad('posting/list?field=app_form&sort=
{{Session::get("posting_sort")=="asc"?"desc":"asc"}}')">
            General Saving
        </a>
        <i style="font-size: 12px"
           class="glyphicon  {{ Session::get('posting_field')=='app_form'?
(Session::get('posting_sort')=='asc'?'glyphicon-sort-by-
alphabet':'glyphicon-sort-by-alphabet-alt'):'' }}">
        </i>
    </th>
    <th>
        <a href="javascript:ajaxLoad('posting/list?field=passbook&sort=
{{Session::get("posting_sort")=="asc"?"desc":"asc"}}')">
            DPS
        </a>
        <i style="font-size: 12px"
           class="glyphicon  {{ Session::get('posting_field')=='passbook'?
(Session::get('posting_sort')=='asc'?'glyphicon-sort-by-
alphabet':'glyphicon-sort-by-alphabet-alt'):'' }}">
        </i>
    </th>

    <th width="140px">Actions</th>
</tr>
</thead>
<tbody id="searchShow" class="searchShow">

</tbody>
</table>
<div class="pull-right"></div>
<div class="row" id="totalRecord">

    Total: records

</div>
</div>


我的jQuery代码如下:

$(document).ready(function () {
        $(document).on('click', '#searchInfo', function () {
            var DomainName = document.getElementById('DomainName').value;
            var DivisionOfficeId =
                          document.getElementById('DivisionOfficeId').value;
            var ZoneId = document.getElementById('ZoneId').value;
            var AreaId = document.getElementById('AreaId').value;
            var MonthId = document.getElementById('MonthId').value;
            var YearId = document.getElementById('YearId').value;

            var i = 1;
            var j = 0;

            $('#searchShow').empty();
            $.ajax({
                type: 'get',
                url: 'getSearchinfo',
                data: {'DomainName': DomainName, 'DivisionOfficeId':
 DivisionOfficeId, 'ZoneId': ZoneId, 'AreaId':AreaId, 'MonthId': MonthId,
 'YearId': YearId},
                success: function (data) {

                    $.each(data, function (index, subcatObj3p) {
                        $('#searchShow').append('<tr><td style="text-align:
center" id="'+i+'">' + i + '</td><td style="text-align: center">' +
subcatObj3p.MemberId + '</td><td style="text-align: center">' +
subcatObj3p.MemberName + '</td><td style="text-align: center">' +
subcatObj3p.AccountNo + '</td><td><input style="width:30%" type="text"
Name="Dps" value="100"></input></td><td><input style="width:30%" type="text"
Name="Dps" value="'+subcatObj3p.MonthlyInstallment+'"></input></td><td>
<input type="submit" value="submit" id="goDB"></td></tr>');
                        i++;
                        j=i;


                    });
                    // document.getElementById('hidden').value = i - 1;
                    alert(j);
                    $('#totalRecord').val(j);
                },
                error: function () {
                }
            });

        });
    });


这是我的控制器功能:

 public function getSearchinfo(Request $request){

    $DomainName = $request->DomainName;
    $DivisionOfficeId = $request->DivisionOfficeId;
    $ZoneId = $request->ZoneId;
    $AreaId = $request->AreaId;
    $MonthId = $request->MonthId;
    $YearId = $request->YearId;

    $searchInfo = Accountopen::select('*')
                        ->join('members', 'accountopens.MemberId' , '=',
 'members.MemberId')
                        ->where('members.DomainName', $DomainName)
                        ->orWhere('accountopens.DivisionOfficeId','=',
 $DivisionOfficeId)
                        ->orWhere('accountopens.ZoneId','=', $ZoneId)
                        ->orWhere('accountopens.AreaId','=', $AreaId)
                        // ->where('accountopens.MonthId', $MonthId)
                        // ->where('accountopens.YearId', $YearId)
                        ->get();

    return response()->json($searchInfo);
}


现在,我想单击“提交”按钮,然后逐行发送行数据。请回复我。我正在使用laravel 5.2版本。

最佳答案

为所有classUpdate / Edit button提供一个公共anchor,并传递要更新的行的ID值。并参考以下示例:



$('.edit').click(function(){
	alert( $(this).closest('td').attr('id') );
  // make ajax call here
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table border="1">
  <tr>
    <td id="1">One <a href="javascript:void(0);" class="edit">Edit</a></td>
   </tr>
   <tr>
    <td id="2">Two <a href="javascript:void(0);" class="edit">Edit</a></td>
   </tr>
   <tr>
    <td id="3">Three <a href="javascript:void(0);" class="edit">Edit</a></td>
  </tr>
</table>





使用上面给定的方法并相应地进行ajax调用。

07-24 17:49
查看更多