2016-05-06 14 views
1

我设法创建了一个脚本,它通过在javascript的帮助下单击按钮来添加输入文本框,但是我想要的是创建无限数量的MYSQL字段并将数据保存到数据库使用html表单。在Laravel 5.2中动态添加MySQL字段

目前我已经设置JavaScript来填充只有10个输入文本框,因为我只在MySQL表中创建了10个字段。

有没有一种方法可以按需创建MySQL字段,而不是限制为10个字段,或者是否存在使用laravel来解决此问题的另一种解决方案。

下面是HTML代码

{{ Form::open(array('url' => '/Reward_details',)) }} 

{{ csrf_field() }} 

<div class="row"> 

<div class="col-md-6"> 
    <b>Prize#1</b><br> 

<div class="form-group"> 
    {{ Form::label('pledged_amount', 'Pledged Amount:') }} 
    {{ Form::text('pledged_amount', null, ['class' => 'form-control', "required", 'placeholder' => 'Add Pledged Amount']) }} 

</div> 


<div class="form-group"> 
    {{ Form::label('reward', 'Reward Description:') }} 
    {{ Form::textarea('reward_description', null, ['class' => 'form-control', 'rows' => '5', "required"]) }} 

</div> 


<div class="input_fields_wrap"><br><br><br><br> 
<div class="col-lg-12"> 
    <a class=" btn btn-success col-lg-12 btn-margin-top add_field_button">Add Reward Per Pledge</a> 
    </div> 

</div> 

    </div> 
    </div> 

<hr> 

<div class="col-mid-12"> 
    <div class="form-group"> 

     {{ Form::submit('Submit Reward Details', ['class' => 'btn btn-primary']) }} 

    </div> 
</div> 


{{ Form::close() }} 

,这里是我的脚本

<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
    var max_fields  = 10; //maximum input boxes allowed 
    var wrapper   = $(".input_fields_wrap"); //Fields wrapper 
    var add_button  = $(".add_field_button"); //Add button ID 

    var n = 0; 
    var x = 1; //initlal text box count 
    var i=1;// counts the number on Prizes 
    $(add_button).click(function(e){ //on add input button click 
     e.preventDefault(); 
     if(x < max_fields){ //max input box allowed 
      n++; 
      x++; 
      i++; //text box increment 
      $(wrapper).prepend('<div class="col-md-12 nopadding form-group">' + 
      '<p>Prize#'+ +i +'</p>'+ 

      '<label for="pledged_amount">Pledged Amount:</label>' + 
      '<input class="form-control" type="text" name="pledged_amount'+ +n +'" required/><br>'+ 

      '<label for="pledged_amount">Reward Description:</label>'+ 
      '<textarea class="form-control" rows="5" type="text" name="reward_description'+ +n +'" required/></textarea><br>'+ 

      '<a href="#" class="btn btn-xs btn-danger remove_field">Remove</a>'+ 
      '</div>'); //add input box 
     } 
    }); 

    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text 
     e.preventDefault(); $(this).parent('div').remove(); x--; 
    }) 
}); 

脚本只是追加10个输入文本框,因为我创造了只有十在MySQL领域。

+0

按字段你的意思是表列的权利? – Abhishek

+0

是的,MYSQL表列 –

+0

那你不应该那样做。制作'无限'列数是没有意义的。 – Abhishek

回答

1

你不应该创建列的无限数量

相反,你应该为您的输入字段作为阵列

比方说: pledge_amount[]

并获得该数组中后端的阵列。循环彻底并在表格中输入行,而不是添加列。

+0

谢谢我没有想到这一点。 –

+0

这使得查询恶梦,你也可以抛出窗口索引。有些情况下动态列是可以接受的。 – kjdion84