如何从db检索数据并使用jquery #codeigniter

时间:2017-03-30 06:21:26

标签: jquery ajax codeigniter

这段代码仍无效,我在这个论坛上有一些动态输入字段,比如这个

$(document).ready(function() {
var counter = 2;
   $("#addField").click(function () {
   if(counter>110){
           alert("Only 110 textboxes allow");
           return false;
   }

var newTextDiv = $(document.createElement('div'))
        .attr("id", 'TextDiv' + counter);
newTextDiv.after().html('<table class="table">'+
       '<tr>' +
       '<td width="400" style="padding: 10px;">' +
       '<p style="color: teal; font-size: 14px;"><span class="glyphicon glyphicon-home"></span> Building '+ counter +'</p>' +
       '<label class="control-label">Building name :</label>' +
       '<input type="text" class="form-control input-sm" id="id_building_name' + counter +'" name="field[building_name][]'+ counter +'"/>' +
       '<label class="control-label">Year build :</label>' +
       '<input type="text" class="form-control input-sm" id="id_year_build'+ counter +'" name="field[year_build][]'+ counter +'"/>' +
       '</td>' +
       '</tr>' +
        '</table>'
    );
    
  newTextDiv.appendTo("#TextGroup");
   counter++;
    });

   $("#removeField").click(function () {
     if(counter==1){
           alert("No more textbox to remove");
           return false;
        }
    counter--;
    $("#TextDiv" + counter).remove();
   });
  
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

<div id='TextGroup'>
  <div id="TextDiv">
    <table class="table">
      <tr>
        <p style="margin-left: 25px; color: teal; font-size: 14px;"> <span class="glyphicon glyphicon-home"></span>     Building 1</p>
<td>
  <div class="form-group">
    <label class="control-label">Building name :</label>
      <input type="text" class="form-control input-sm" id="id_building_name1" name="field[building_name][]"/>
    <label class="control-label">Year build :</label>
      <input type="text" class="form-control input-sm" id="id_year_build1" name="field[year_build][]"/>
  </div>
</td>
</tr>
<tr>  
<td>
<div class="box-main" style="padding-bottom: 10px;">
<label>Is there any other building ?</label><br/>
<input type='button' value='Add Field' id='addField' class="btn btn-info btn-sm">&nbsp; 
<input type='button' value='Remove Field' id='removeField' class="btn btn-danger btn-sm">&nbsp;
<input type='button' value='Edit Value' id='editValue' class="btn btn-warning btn-sm">
</div>
</td> 
</tr>
</table>
</div>
</div>

使用jquery然后成功保存到db ..问题是如何将数据(编辑数据事务)放入动态输入字段? 请帮助..谢谢

1 个答案:

答案 0 :(得分:0)

这不是您的确切代码,但它会介绍如何在表单中转储和填充动态字段。浏览代码片段中的评论。

这是视图文件

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<form action="<?php echo base_url()?>controller/desired_controller_dump_function">
    <div class="controls">
        <dynamic>
            <label for="other_charges">Add Tiered Discount & Qty <small>(click the green button to add more)</small>
            </label>
            <br>

            <?php 
            //assuming $dynamic_fields_form_data is result of row_array() in codeigniter; 
            $discount_quantity_arr=json_decode($dynamic_fields_form_data[ 'discount_quantity'],true); //converting from json string to array 
            $discount_percentage_arr=json_decode($dynamic_fields_form_data[ 'discount_percentage'],true); 
     //$discount_quantity_arr=[]; //for testing code without data
     //$discount_percentage_arr=[]; //for testing code without data

            if(!empty($discount_percentage_arr)){ foreach($discount_percentage_arr as $k=> $v){ ?>
            <div class="entry input-group col-xs-12 form-group ">

                <div class="row">
                    <div class="col-xs-4">
                        <input class="form-control" name="discount_quantity[]" type="number" placeholder="Quantity" value="<?php echo $discount_quantity_arr[$k]?>" />
                    </div>
                    <div class="col-xs-4">
                        <input class="form-control" name="discount_percentage[]" type="number" placeholder="percentage" value="<?php echo  $discount_percentage_arr[$k]?>" />
                    </div>
                    <div class="col-xs-2">
                        <span class="input-group-btn">
                            <?php
                                if($k+1==count($discount_percentage_arr)){
                            ?>
                            <button class="btn btn-success btn-add" type="button" style="font-size:2vh">
                                <span class="glyphicon glyphicon-plus"></span>
                        </button>

                        <?php } else{ ?>
                        <button class="btn btn-remove btn-danger" type="button" style="font-size:2vh">
                            <span class="glyphicon glyphicon-minus"></span>
                        </button>
                        <?php } ?>
                        </span>
                    </div>
                </div>

            </div>
            <?php } }else{ ?>

            <div class="entry input-group col-xs-12 form-group ">

                <div class="row">
                    <div class="col-xs-4">
                        <input class="form-control" name="discount_quantity[]" type="number" placeholder="Quantity" value="" />
                    </div>
                    <div class="col-xs-4">
                        <input class="form-control" name="discount_percentage[]" type="number" placeholder="percentage" value="" />
                    </div>
                    <div class="col-xs-2">
                        <span class="input-group-btn">
               <button class="btn btn-success btn-add" type="button" style="font-size:2vh">
                 <span class="glyphicon glyphicon-plus"></span>
                        </button>
                        </span>
                    </div>
                </div>

            </div>

            <?php } ?>

        </dynamic>
    </div>
    <button type="submit" class="btn btn-default"> Submit</button>
</form>
<script>
    $(function() {
        $(document).on('click', '.btn-add', function(e) {
            e.preventDefault();
            var controlForm = $('.controls dynamic:first');
            var currentEntry = $(this).parents('.entry:first');
            var newEntry = $(currentEntry.clone()).appendTo(controlForm);

            newEntry.find('input').val('');
            controlForm.find('.entry:not(:last) .btn-add')
                .removeClass('btn-add').addClass('btn-remove')
                .removeClass('btn-success').addClass('btn-danger')
                .html('<span class="glyphicon glyphicon-minus"></span>');
        }).on('click', '.btn-remove', function(e) {
            $(this).parents('.entry:first').remove();
            e.preventDefault();
            return false;
        });
    })
</script>

这是控制器功能

public function desired_controller_dump_function(){
    extract($this->input->post());
    $discount_quantity=json_encode($discount_quantity); //change to json string and save in database as string
    $discount_percentage=json_encode($discount_percentage);
    //save this variable in database through model
    $this->model_function->dumpdata($discount_quantity,$discount_percentage);
   //remaining process

}

public function desired_controller_get_function(){
    $data['dynamic_fields_form_data']=$this->model_function->getdata();//function to get data from database through model
    $this->load->view('dynamic_field_file',$data);
}