Question

我很难通过Codeigniter中的AJAX调用传递多个值。

我的观点是：

<script>
$( document ).ready(function() {

    var current_id = 0;
 $('#btn').click(function(){
     nextElement($('#Outer_00'));
 })

 function nextElement(element){
     var newElement = element.clone()
     .find("input:text").val("").end();

     var id = current_id+1;
     current_id = id;
     if(id <10)id = "0"+id;

     $('input', newElement).attr("id", id );
     newElement.appendTo($("#elements"));
            if($('#elements').find('div').length=='5')
    {
    $('#btn').prop('disabled',true);
    }
 }


$('#exercises').on('click', '.remove', function() {
if($('#elements').find('div').length<'6')
{

$('#btn').prop('disabled',false);
}
  if($('#elements').find('div').length=='1')
{
    $('.remove').addAttr("disabled",true);
}

$(this).parent().remove();

return false; //prevent form submission
});
});
</script>

/ *********

<script>
var  base_url = '<?=base_url()?>';
$(document).ready(function()
    {
        $('#Edit').click(function()
        {
            $('#Name').removeAttr("disabled");


    });

    $('#Add').click(function()
    {
        $('#Name').attr("disabled","disabled");
        $('#Phone').attr("disabled","disabled");
        $('#email').attr("disabled","disabled");
        $('#CurrentlyLocated').attr("disabled","disabled");
        $('#KeySkills').attr("disabled","disabled");
        //var queryString = $('#form1').serialize();



                $.ajax({
                    url: '<?php echo site_url('PutArtistProfile_c/formDataSubmit');?>',
                  type : 'POST', //the way you want to send datas to your URL
                  data: {Name:$("#Name").val(), Phone: $("#Phone").val(), email: $("#email").val(),
                         birthday: $("#birthday").val(), bornIn: $("#bornIn").val(),
                         CurrentlyLocated: $("#CurrentlyLocated").val(), KeySkills: $("#KeySkills").val(),
                         Audio1: $("#00").val(), Audio2: $("#01").val(), Audio3: $("#02").val(),Audio4: $("#03").val(), Audio5: $("#04").val(),
                         },                     
                  success : function(data)
                  { //probably this request will return anything, it'll be put in var "data"
                    $('body').html(data);                   

                  }
               });  

    });
    });
</script>

<p>

<div id="elements">
<div id="Outer_00">
Audio:  <input type="text" id="00" value="">
<input type="button" class="remove" value="x"></button>

</div>
</div>

<div id="count"></div>
<input type="button" id="btn" value="Add Audio"></button>
</p>

enter image description here

我的控制器是：

public function formDataSubmit()
{

    $queryAudio1 = $this->input->post('Audio1');
            $queryAudio2 = $this->input->post('Audio2');
            $queryAudio3 = $this->input->post('Audio3');
            $queryAudio4 = $this->input->post('Audio4');
            $queryAudio5 = $this->input->post('Audio5');

}

如何传递文本框的多个值？上面的代码将值传递给控制器。但是在单击“x”按钮时，文本框的值已被删除，但文本框的ID正在增加，因此我无法通过AJAX将文本框的其他值传递给控制器。请帮帮我。

Answer 1

而不是：

 data: {Name:$("#Name").val(), Phone: $("#Phone").val(), email: $("#email").val(),
                             birthday: $("#birthday").val(), bornIn: $("#bornIn").val(),
                             CurrentlyLocated: $("#CurrentlyLocated").val(), KeySkills: $("#KeySkills").val(),
                             Audio1: $("#00").val(), Audio2: $("#01").val(), Audio3: $("#02").val(),Audio4: $("#03").val(), Audio5: $("#04").val(),
                             },

你可以这样做

data:$("#Form_id").serialize(); // all form data will be passed to controller as Post data.

Answer 2

如果你有一个删除按钮，那么按id获取值可能会导致js错误，为什么不使用html元素数组：

<div id="elements">
<div id="Outer_00">
Audio:  <input type="text" name="audio[]" value="">
<input type="button" class="remove" value="x"></button>
</div>
</div>

Answer 3

IT非常简单：

考虑您要传递：用户名，姓和国家/地区。这些是   然后输入三个输入框：

使用Jquery：

Javascript方

$.post("url",{name:name,surname:surname,country:country},
function(data){
  console.log("Query success");
});

在您的模型或控制器中处理您的查询

$name=$this->input->post("name");
$surname=$this->input->post("surname");
$country=$this->input->post("country");

在您的情况下只需传递您需要的参数。我用codignitter和这种方法工作正常！

通过AJAX传递多个值

3 个答案: