如何將多個具有相同類名的id值作爲數組發送到codeigniter中的數據庫？

Question

嗨，大家好，我試圖發送多個id相同的類名，但不同的id值使用ajax數據庫，但它只挑選第一個值不是所有的值我怎麼能發送這些多個值。

這裏是我的代碼 觀點

<li><div class="hour_slots_available" id="01_02"><span class="hour_tag">01:00 - 02:00</span></div></li> 
<li><div class="hour_slots_available" id="02_03"><span class="hour_tag">02:00 - 03:00</span></div></li> 
<li><div class="hour_slots_available" id="03_04"><span class="hour_tag">03:00 - 04:00</span></div></li> 
<li><div class="hour_slots_available" id="04_05"><span class="hour_tag">04:00 - 05:00</span></div></li> 
<li><div class="hour_slots_available" id="05_06"><span class="hour_tag">05:00 - 06:00</span></div></li> 
<li><div class="hour_slots_available" id="06_07"><span class="hour_tag">06:00 - 07:00</span></div></li> 
<li><div class="hour_slots_available" id="07_08"><span class="hour_tag">07:00 - 08:00</span></div></li> 
<li><div class="hour_slots_available" id="08_09"><span class="hour_tag">08:00 - 09:00</span></div></li> 
<li><div class="hour_slots_available" id="09_10"><span class="hour_tag">09:00 - 10:00</span></div></li> 

now on click 
<button class="btn btn-success" onclick="gethourprice();">Get Prices</button> 

當這個函數調用我想提供，如果他們選擇了到數據庫陣列課時插槽股利。

這裏

<script type="text/javascript">  
function gethourprice() 
{  
var selected_ids = document.getElementsByClassName('hour_slots_available ').id; 
alert(selected_ids);  
} 
</script> 

但是當警報調用selected_ids只顯示一個ID 12_01 什麼似乎是這裏的問題？你能告訴我嗎 ？

Answer 1

試試這個：一旦你與匹配類中的所有對象，迭代的對象，並收集所有的ID，請參見下面的代碼

function gethourprice() 
{  
var selectedIds=""; 
var selectedObject = document.getElementsByClassName('hour_slots_available '); 
for(var i=0;i<selectedObject.length;i++) 
    selectedIds+=selectedObject[i].id+","; 
alert(selectedIds);  
} 

Answer 2

您需要使用循環這裏

function gethourprice(){ 

    var selected_ids = document.getElementsByClassName('hour_slots_available ').id; 
    for(var i = 0; i < selected_ids.length; i++) { 
     alert(selected_ids[i]); // Will alert all ids in loop 
    } 
} 

Answer 3

您應該使用像這樣的東西

function GetAllIds(){ 
    var idsArray = []; 
    $(".hour_slots_available").each(function(){ 
     idsArray.push($(this).attr("id")); 
     //or may be a comma seperated list 
     //use jquery. write less do more :) 
    }); 
    return idsArray; 
} 

Answer 4

你可以得到數組arrayDiv所有的值，現在y你可以很容易地將數組arrayDiv傳遞給ajax。

代碼...

var arrayDiv = new Array();; 
 

 
$('#getv').click(function(){ 
 
$('.hour_slots_available').each(function(i){ 
 
    arrayDiv.push($(this).attr('id')); 
 
}); 
 
console.log(arrayDiv); 
 
// you can call Your ajax here 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li><div class="hour_slots_available" id="01_02"><span class="hour_tag">01:00 - 02:00</span></div></li> 
 
<li><div class="hour_slots_available" id="02_03"><span class="hour_tag">02:00 - 03:00</span></div></li> 
 
<li><div class="hour_slots_available" id="03_04"><span class="hour_tag">03:00 - 04:00</span></div></li> 
 
<li><div class="hour_slots_available" id="04_05"><span class="hour_tag">04:00 - 05:00</span></div></li> 
 
<li><div class="hour_slots_available" id="05_06"><span class="hour_tag">05:00 - 06:00</span></div></li> 
 
<li><div class="hour_slots_available" id="06_07"><span class="hour_tag">06:00 - 07:00</span></div></li> 
 
<li><div class="hour_slots_available" id="07_08"><span class="hour_tag">07:00 - 08:00</span></div></li> 
 
<li><div class="hour_slots_available" id="08_09"><span class="hour_tag">08:00 - 09:00</span></div></li> 
 
<li><div class="hour_slots_available" id="09_10"><span class="hour_tag">09:00 - 10:00</span></div></li> 
 

 
now on click 
 
<button id="getv" class="btn btn-success" >Get Prices</button>

Answer 5

但是當警報調用selected_ids只顯示一個ID 12_01 什麼似乎是這裏的問題？你能告訴我嗎 ？

因爲document.getElementsByClassName返回多個字符串的數組，而不是單個字符串。

請記住，您要求的數組的id值，您共享的代碼返回未定義。因此，您需要刪除document.getElementsByClassName('hour_slots_available ').id中的.id部分，然後遍歷selected_ids來操作單個字符串。

實施例：

function gethourprice() { 
    var selected_ids = document.getElementsByClassName('hour_slots_available '); 
    for (id in selected_ids) { 
    alert(id); 
    }; 
}; 
gethourprice(); 

CodePen演示（使用的console.log代替警報）：

http://codepen.io/robee/pen/GWZxor

Answer 6

getElementsByClassName方法函數將返回元件的陣列。但它不是JavaScript本地功能。 getElementsByClassName函數的get屬性將取決於您的瀏覽器。您需要編輯您的gethourprice以獲取id形式的元素數組。這裏是示例

<script type="text/javascript"> 

    function gethourprice(){ 

     var selected_ids = document.getElementsByClassName('hour_slots_available'); 
     var ids = []; 
     for (var i = 0; i < selected_ids.length; i++) { 
      ids.push(selected_ids[i].id) 
     } 
     alert(ids); 
    } 
</script>