Javascript 单击一个按钮提交两份表格,并将第一份表格的响应传递给第二份表格
我试图提交一个单一的点击2表。1个表单仅包含文本框,第2个表单具有dropzone图像。现在,当第一个表单提交时,它应该返回第二个表单,我需要在提交时传递该id,以便图像将根据该id保存在数据库中。文本框表单由不知道如何获取id提交,问题是将图像保存在第二个表单中 HTML表单Javascript 单击一个按钮提交两份表格,并将第一份表格的响应传递给第二份表格,javascript,jquery,ajax,laravel,dropzone,Javascript,Jquery,Ajax,Laravel,Dropzone,我试图提交一个单一的点击2表。1个表单仅包含文本框,第2个表单具有dropzone图像。现在,当第一个表单提交时,它应该返回第二个表单,我需要在提交时传递该id,以便图像将根据该id保存在数据库中。文本框表单由不知道如何获取id提交,问题是将图像保存在第二个表单中 HTML表单 <div class="modal-body p0"> <div id="" > <div class="max-wi
<div class="modal-body p0">
<div id="" >
<div class="max-wid">
<div class="pl-3 pr-3 mb-5 p0">
<div class="">
<div class=" f-column in">
<div class="">
<ul class="nav nav-tabs nav-border-producttab">
<li class="nav-item ">
<a class="nav-link active" data-toggle="tab" href="#add_new_products2">Add New Product</a>
</li>
</ul>
</div>
<div class="">
<div >
<div class=" mt-3">
<div class="tab-content model-hit">
<div id="add_new_products2" class="container tab-pane active">
<br>
<div class=" row">
<div class="col-sm-6">
<div class="col-sm-12 p-0 mrg_modal_produt">
<div class="col-sm-12 p-0 label_modal_product">
Product Documents
<div class="clearfix"></div>
<div class="gry f-13">(Specs, CHPS Certificate, Product Data Sheet)</div>
</div>
</div>
<?php echo Form::open(array('route' => 'architecture-product-file-save', 'files' => true, 'method' => 'PUT', 'id' => 'product-file-form', 'class' => 'dropzone')); ?>
<div id="preview-template" style="display: none;">
<div class="dz-preview dz-file-preview">
<div class="dz-image"><img data-dz-thumbnail /></div>
<div class="dz-file-type">
<br />
<select name="file_type" class="dz-file-type-select">
<option value="">Select File Type</option>
<option value="datasheet_file">Datasheet</option>
<option value="cad_file">CAD file</option>
<option value="bim_file">BIM file</option>
</select>
</div>
</div>
</div>
<input type="submit" class="btn btn-info" value="Save" id="save-product-files-submit" style="display:none;">
</form>
</div>
<?php echo Form::open(array('route' => 'architecture-product-save', 'files' => true, 'id' => 'product-form')) ?>
<div class="col-sm-12">
<div class="col-sm-12 p-0 mrg_modal_produt">
<input name="name" type="text" class="form-control input_product_modal" value="Product Name">
<input name="" type="text" class="form-control input_product_modal" value="Manufacturer Name">
<select name="division" id="division" class="form-control input_product_modal">
<option>MasterFormat Division</option>
@foreach ($division_list as $item)
<option value="{{$item->id}}">{{$item->name}}</option>
@endforeach
</select>
<select name="section" id="section" class="form-control input_product_modal">
</select>
<textarea name="" class="form-control input_product_modal" cols="" rows="">Product Description (copy and paste from manufactures information)</textarea>
<input name="" type="text" class="form-control input_product_modal" value="LEED data">
<input name="website" type="text" class="form-control input_product_modal" value="Link to product website">
<input name="video_file" type="text" class="form-control input_product_modal" value="Link to Product Video (YouTube or Vimeo)">
<input name="bim_file_url" type="text" class="form-control input_product_modal" value="Link to BIM file">
<input name="" type="text" class="form-control input_product_modal" value="Link to AIA learning unit course">
</div>
</div>
<input type="submit" class="btn btn-info" value="Save" id="save-product-form-submit" style="display:none;">
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn-bg2" data-dismiss="modal">Cancel</button>
<input type="button" class="btn-bg1" id="save-product-form" value="Add to Project">
</div>
</div>
错误:
传递给App\Modules\Manufacturer\Controllers\ProjectController::ArchitectProductFileUpdate()的参数2必须是Illumb\Http\Request的一个实例,未给出任何实例。根据我的理解,首先提交第一个表单,将数据插入DB并生成ID,然后在第二个表单提交中需要此ID。如果是,那么您可以这样做:
$("#ffid").val(response.ID)// response.ID is response from first form submission.
$(“#保存产品表单”)。单击(函数(){
$(“#保存产品表单提交”)。单击();
$(“#保存产品表单提交”)。单击(函数(响应){
警报(响应);//让我们看看id是否来了
});
$(“#保存产品文件并提交”)。单击();
})
即使出现此异常,第一个函数是否将您的输入保存到数据库中?是的,第一个函数按预期保存数据并返回最新插入的id@zlatangoralijaok,我不明白您为什么需要两个单独的表单,我觉得这一切都可以在一个表单中完成。是的,它可以在一个表单中完成,但因为我使用dropzone插件样式对我来说是一个问题,所以我为图像创建了一个单独的表单dropzone自动附加表单,所以当添加第一个表单的数据时,它会获得我需要在第二个表单conatains图像中传递id的id,以便插入图像根据所描述的id@zlatangoralijaAs,这听起来像是一个破损的设计$('save product form')。单击(函数(){$('save product form submit')。单击();$('save product files submit')。单击()
以下是我如何在单击时获得响应的代码表单已提交如何获得您提到的响应我再次编辑了我的答案,您能否再试一次。它重定向到控制器方法并返回id,但我不希望它重定向保存数据(如ajax)并在同一页面上返回id
public function ArchitectureProductSave(Request $request){
$architecture = Manufacturer::where('user_id', Auth::user()->id)->get()->first();
$lastRecordSeq = DB::table('products')
->where('manufacturer_id',$architecture->id)
->where('section_id',Input::get('section_id'))
->orderBy('sequence_id','desc')
->first();
if(!empty($lastRecordSeq))
{
$sequenceId = $lastRecordSeq->sequence_id;
$sequenceId = $sequenceId + 1;
}
else
{
$sequenceId = 1;
}
$product = new Product;
$product->name = Input::get('name');
$product->description = Input::get('description');
$product->manufacturer_id = $architecture->id;
$product->division_id = Input::get('division');
$product->section_id = Input::get('section');
$product->sequence_id = $sequenceId;
$productVideoFile = Input::get('video_file');
$productVideFileArr = explode('&', $productVideoFile);
if(empty($productVideFileArr)){
$product->video_file = Input::get('video_file');
}else{
$product->video_file = $productVideFileArr[0];
}
$product->cad_file_url = Input::get('cad_file_url');
$product->bim_file_url = Input::get('bim_file_url');
$product->website = Input::get('website');
if ($product->save())
{
$msg = $product->id;
return response()->json([
'message' => $msg
], 200);
}
}
public function ArchitectProductFileUpdate($id, Request $request) {
dd($request)}
$("#ffid").val(response.ID)// response.ID is response from first form submission.
$('#save-product-form').click(function (){
$('#save-product-form-submit').click();
$('#save-product-form-submit').click(function(response){
alert(response);//let see id is coming or not
});
$('#save-product-files-submit').click();
})
</script>