ajax在空间之后移除所有东西

时间:2017-04-26 15:07:02

标签: javascript php jquery ajax codeigniter

在我的表单选择字段中,我使用ajax列出我的选项,但是当提交给控制器时,空格后的所有内容都将被删除。

<div class="col-md-9">
<form class="" action="<?php echo base_url(); ?>Sms/add" method="post">
  <div class="box box-primary">
    <div class="box-header with-border">
      <h3 class="box-title">Compose New Message</h3>
    </div>
    <!-- /.box-header -->
    <div class="box-body">
      <div class="form-group">
        <input class="form-control" value="<?php echo set_value('title'); ?>" name="title" placeholder="Subject: 20 characters" maxlength="20">
      </div>
      <div class="form-group">
            <textarea id="compose-textarea" name="message" class="form-control" style="height: 150px" placeholder=" Enter your message here: 150 characters" maxlength="150"><?php echo set_value('message'); ?></textarea>
      </div>
      <div class="form-group">
        <label><input type="radio" class="flat-red" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck" value="company"> Send To Company's Database</label>
      </div>

      <div class="form-group">
        <label><input type="radio" class="flat-red" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck" value="ecofarmer"> Send To Ecofarmer Database</label>
      </div>
      <div id="ifYes" style="display:none" class="form-group">
      <select class="form-control" name="database_name">
        <option value="">Choose target</option>
        <?php foreach ($databases as $item): ?>
          <option value="<?php echo $item->db_id; ?>"><?php echo $item->db_name; ?></option>
        <?php endforeach; ?>
      </select>
      </div>
      <div id="ifNo" style="display:none">
        <div class="form-group">
        <select class="form-control" name="province" id="province">
          <option value="">Choose Province</option>
          <?php foreach ($provinces as $item): ?>
            <option value="<?php echo $item->province_id; ?>"><?php echo $item->province_name; ?></option>
          <?php endforeach; ?>
        </select>
        </div>
        <div class="form-group">
        <select class="form-control" name="district" id="district" disabled="disabled">
          <option value="">Choose District</option>
        </select>
        </div>
        <div class="form-group">
        <select class="form-control" name="ward" id="ward" disabled="disabled">
          <option value="">Choose Ward</option>
        </select>
        </div>
      </div>
    </div>
    <!-- /.box-body -->
    <div class="box-footer">
      <div class="pull-right">
        <button type="submit" name="draft" class="btn btn-default" value="true"><i class="fa fa-pencil"></i> Draft</button>
        <button type="submit" name="submit" class="btn btn-primary" value="true"><i class="fa fa-envelope-o"></i> Send</button>
      </div>
      <button type="reset" class="btn btn-default"><i class="fa fa-times"></i> Discard</button>
    </div>
    <!-- /.box-footer -->
  </div>
  <!-- /. box -->
</form>

  

以下是我用于收音机输入和选择选项的JavaScript

<script type="text/javascript">

function yesnoCheck() {
    if (document.getElementById('yesCheck').checked) {
        document.getElementById('ifYes').style.display = 'inline';
    }
    else document.getElementById('ifYes').style.display = 'none';

    if (document.getElementById('noCheck').checked) {
        document.getElementById('ifNo').style.display = 'inline';
    }
    else document.getElementById('ifNo').style.display = 'none';

}


$('#province').change(function() {
      var province = this.value;
        $.ajax({
            url: "<?php echo base_url('Sms/get_district'); ?>",
            data:{pID:province},
            type: 'post',
            success: function(data){
                var arr = JSON.parse(data);
                document.getElementById("district").disabled = false;
                var $el = $("#district");
                $el.empty();
                $el.append($("<option>Choose District</option>"));
                $.each($(arr),function(key,value){
                  var div_data="<option value="+value.district_id+">"+value.district_name+"</option>";
                  $(div_data).appendTo('#district');
                  console.log(value.district_name);
                });
            }
        });
    });


  $('#district').change(function() {
        var district = this.value;
          $.ajax({
              url: "<?php echo base_url('Sms/get_ward'); ?>",
              data:{dID:district},
              type: 'post',
              success: function(data){
                  var arr = JSON.parse(data);
                  document.getElementById("ward").disabled = false;
                  var $il = $("#ward");
                  $il.empty();
                  $il.append($("<option>Choose A Ward</option>"));
                  $.each($(arr),function(key,value){
                    var div_data="<option value="+value.ward_number+">"+value.ward_number+"</option>";
                    $(div_data).appendTo('#ward');
                    console.log(value.ward_number);
                  });
              }
          });
      });

现在,当我提交选区的价值时,正在删除空间之后的所有内容。我该如何防止这种情况发生?

1 个答案:

答案 0 :(得分:0)

问题在于引用 我改变了下面的代码

var div_data="<option value="+value.ward_number+">"+value.ward_number+"</option>";

到此

var div_data = '<option value="' + value.ward_number + '">' + value.ward_number + '</option>';