Javascript 在动态输入字段中编辑/更新相关下拉列表
我想编辑一张发票,其中包含产品(动态添加的字段有3个动态下拉列表)。 所以,我的想法是,我想展示发票上的旧产品,并可能添加新产品。 但我不知道如何获取动态下拉列表的旧值。 我只使用类别,因为它在刀片中,但问题是当我创建一个新产品时,我得到的类别与前一个相同 编辑发票刀片Javascript 在动态输入字段中编辑/更新相关下拉列表,javascript,jquery,laravel,eloquent,drop-down-menu,Javascript,Jquery,Laravel,Eloquent,Drop Down Menu,我想编辑一张发票,其中包含产品(动态添加的字段有3个动态下拉列表)。 所以,我的想法是,我想展示发票上的旧产品,并可能添加新产品。 但我不知道如何获取动态下拉列表的旧值。 我只使用类别,因为它在刀片中,但问题是当我创建一个新产品时,我得到的类别与前一个相同 编辑发票刀片 <tbody class="addMoreProduct"> @foreach ($invoices->d
<tbody class="addMoreProduct">
@foreach ($invoices->details as $item)
<tr id="{{$loop->index}}">
<td>
<select name="categorie_id[{{ $loop->index }}]" id="categorie_id"
class="form-control categorie_id ">
<option label="Choisir Categorie"></option>
@foreach ($categories as $categorie)
<option value="{{ $categorie->id }}"
{{ $item->categorie_id == $categorie->id ? 'selected' : '' }}>
{{ $categorie->categorie_name }}
</option>
@endforeach
</select>
</td>
<td> <select name="product_id[{{ $loop->index }}]" id="categorie_id"
class="form-control product_id ">
<option label="Choisir Produit"></option>
</select></td>
<td> <select name="size_id[{{ $loop->index }}]" id="size_id" class="form-control size_id ">
<option label="Choisir Designation"></option>
</select></td>
<td>
<input type="text" name="quantity[{{ $loop->index }}]" class="form-control quantity" value="{{ old('quantity', $item->quantity) }}"/>
</td>
<td>
<input type="text" name="unit_price[0]"
class="form-control unit_price " value="{{ old('unit_price', $item->unit_price) }}"/>
</td>
<td>
<input type="text" name="total_price[{{ $loop->index }}]"
class="form-control total_price" value="{{ old('total_price', $item->total_price) }}" readonly />
</td>
<td>
@if ($loop->index == 0)
{{'#'}}
@else
<a class="btn btn-danger btn-sm delete "><i class="fa fa-trash"></i></a>
@endif
</td>
</tr>
@php
$i=$loop->index;
@endphp
@endforeach
</tbody>
@foreach($invoices->明细为$item)
@foreach($categorie作为$categorie的类别)
分类号==$categorie->id?“所选“:”}}>
{{$categorie->categorie_name}
@endforeach
@如果($loop->index==0)
{{'#'}}
@否则
@恩迪夫
@php
$i=$loop->index;
@endphp
@endforeach
发票控制员:更新
public function update(Request $request, invoices $invoices)
{
$invoices = invoices::findOrFail($request->invoice_id);
$data['invoice_no'] = $request->invoice_no;
$data['last_invoice_no'] = $request->last_invoice_no;
$data['devise'] = $request->devise;
$data['customer_name'] = $request->customer_name;
$data['customer_adress'] = $request->customer_adress;
$data['invoice_no'] = $request->invoice_no;
$data['invoice_date'] = $request->invoice_date;
$data['company_adress'] = $request->company_adress;
$data['company_name'] = $request->company_name;
$data['company_phone'] = $request->company_phone;
$data['poids_brut'] = $request->poids_brut;
$data['poids_net'] = $request->poids_net;
$data['livraison'] = $request->livraison;
$data['incoterm'] = $request->incoterm;
$data['payment_details'] = $request->payment_details;
$data['sub_total'] = $request->sub_total;
$data['shipping'] = $request->shipping;
$data['total_due'] = $request->total_due;
$data['created_by'] = (Auth::user()->name);
$invoice = Invoices::create($data);
$details_list = [];
for ($i = 0; $i < count($request->categorie_id); $i++) {
$details_list[$i]['categorie_id'] = $request->categorie_id[$i];
$details_list[$i]['product_id'] = $request->product_id[$i];
$details_list[$i]['size_id'] = $request->size_id[$i];
$details_list[$i]['quantity'] = $request->quantity[$i];
$details_list[$i]['unit_price'] = $request->unit_price[$i];
$details_list[$i]['total_price'] = $request->total_price[$i];
$details_list[$i]['created_by'] = (Auth::user()->name);
}
$details = $invoice->details()->createMany($details_list);
if ($details) {
return redirect()->back()->with([
'message' => __('la facture est créé avec succès'),
'alert-type' => 'success'
]);
} else {
return redirect()->back()->with([
'message' => __('la creation de facture a échoué'),
'alert-type' => 'danger'
]);
}
}
公共功能更新(请求$Request,发票$invoices)
{
$invoices=invoices::findOrFail($request->invoices\u id);
$data['invoice\u no']=$request->invoice\u no;
$data['last\u invoice\u no']=$request->last\u invoice\u no;
$data['designe']=$request->designe;
$data['customer\u name']=$request->customer\u name;
$data['customer\u address']=$request->customer\u address;
$data['invoice\u no']=$request->invoice\u no;
$data['invoice\u date']=$request->invoice\u date;
$data['company\u address']=$request->company\u address;
$data['company\u name']=$request->company\u name;
$data['company\u phone']=$request->company\u phone;
$data['poids\u brut']=$request->poids\u brut;
$data['poids\u net']=$request->poids\u net;
$data['livraison']=$request->livraison;
$data['incoterm']=$request->incoterm;
$data['payment\u details']=$request->payment\u details;
$data['sub_total']=$request->sub_total;
$data['shipping']=$request->shipping;
$data['total\u due']=$request->total\u due;
$data['created_by']=(Auth::user()->name);
$invoice=发票::创建($data);
$details_list=[];
对于($i=0;$icategorie_id);$i++){
$details\u list[$i]['categile\u id']=$request->categile\u id[$i];
$details\u list[$i]['product\u id']=$request->product\u id[$i];
$details\u list[$i]['size\u id']=$request->size\u id[$i];
$details_list[$i]['quantity']=$request->quantity[$i];
$details\u list[$i]['unit\u price']=$request->unit\u price[$i];
$details\u list[$i]['total\u price']=$request->total\u price[$i];
$details_list[$i]['created_by']=(Auth::user()->name);
}
$details=$invoice->details()->createMany($details\u list);
若有($详细信息){
返回重定向()->back()->with([
“消息”=>“制造成功了”,
“警报类型”=>“成功”
]);
}否则{
返回重定向()->back()->with([
“消息”=>“‘aéchoué创作’”,
“警报类型”=>“危险”
]);
}
}
jQuery:
**script responsible for adding new fields :**
var i = '<?php echo $i; ?>';
$('.add_more').on('click', function() {
++i;
var categorie = $('.categorie_id').html();
var tr = '<tr>' +
'<td> <select class="form-control categorie_id " id="categorie_id" name="categorie_id[' + i +
']" >' + categorie +
'</select></td>' +
'<td> <select class="form-control product_id " id=product_id" name="product_id[' + i +
']" ><option label="Choisir Produit"></option></select></td>' +
'<td> <select class="form-control size_id " id="size_id" name="size_id[' + i +
']" ><option label="Choisir Designation"></option></select></td>' +
'<td> <input type="text" name="quantity[' + i + ']" class="form-control quantity" ></td>' +
'<td> <input type="text" name="unit_price[' + i + ']" class="form-control unit_price" ></td>' +
'<td> <input type="text" name="total_price[' + i +
']" class="form-control total_price" readonly></td>' +
'<td> <a class="btn btn-danger btn-sm delete "><i class="fa fa-trash"></a></td></tr>';
$('.addMoreProduct').append(tr);
});
$('.addMoreProduct').delegate('.delete', 'click', function() {
$(this).parent().parent().remove();
});
**负责添加新字段的脚本:**
var i=“”;
$('.add_more')。在('单击',函数()上){
++一,;
变量categorie=$('.categorie_id').html();
var tr=''+
''+分类+
'' +
'尝试注释掉prodEle.empty()
。在ajaxnot working中进行追加之前,会删除原始值,当您更改类别以显示与所选类别相关的产品时,会删除旧值。如果您提供了一个不包含php代码的html示例,这将更容易提供帮助。然后,我们可以在浏览器中实际运行它,并查看e问题。jQuery和ajax响应数据的一个简单示例可能只需要一个示例行。您好,您能简单解释一下什么不起作用吗?当我想要编辑时,所选项目的旧值不会显示
$(document).on('change', 'select[name^="categorie_id"]', function() {
var curEle = jQuery(this);
var categorieID = curEle.val();
var parentEle = curEle.closest('tr');
var prodEle = parentEle.find('select[name^="product_id"]');
var sizeEle = parentEle.find('select[name^="size_id"]');
sizeEle.empty();
prodEle.empty();
if (categorieID) {
jQuery.ajax({
url: '/getProducts/' + categorieID,
type: "GET",
dataType: "json",
success: function(data) {
prodEle.append(' <option label="Choisir Produit"></option>');
sizeEle.append(' <option label="Choisir Designation"></option>');
jQuery.each(data, function(key, value) {
prodEle.append('<option value="' + key + '">' + value +
'</option>');
});
}
});
}
});
$(document).on('change', 'select[name^="product_id"]', function() {
var cur = jQuery(this);
var productID = cur.val();
var parent = cur.closest('tr');
var sizeEle = parent.find('select[name^="size_id"]');
sizeEle.empty();
if (productID) {
jQuery.ajax({
url: '/getDesignation/' + productID,
type: "GET",
dataType: "json",
success: function(data) {
sizeEle.append(' <option label="Choisir Designation"></option>');
jQuery.each(data, function(key, value) {
sizeEle.append('<option value="' + key + '">' + value +
'</option>');
});
}
});
}
});