[英]Edit an entire column in an HTML/PHP table through jquery/javascript/ajax?
我需要幫助!
我有一個php頁面,可從array()生成html表。 此數組包含一個csv的所有行(對此沒有問題):
load_csv.php
<?php
function print_array_of_arrays_to_html_table(&$array_by_reference)
{
echo "<br><table border=1 align=center id=tableID>";
for ($i = 0; $i < count($array_by_reference); $i++)
{
echo "<tr>";
for ($j = 0; $j < count($array_by_reference[$i]); $j++)
{
echo "<td align=right title='f:".$i."\nc:".$j."\nv:".($array_by_reference[$i][$j])."'>".($array_by_reference[$i][$j])."</td>";
}
echo "</tr>";
}
echo "</table>";
}
?>
我的意圖是在文本字段中指示列號,更改該列中所有單元格的所有值。 該列中所有單元格的值均相同。 例如,將所有都更改為“ 0”。
現在,通過“ jquery”,我可以單獨更改任何單元格:
相同的load_csv.php:
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script language="javascript" type="text/javascript">
$('#tableID').click(function(event){
var original = $(event.target).text().toString();
var original_copy = original;
var retValue = prompt("\nChange value? ", original);
//if not empty and OK is pressed
if (retValue !== '' && retValue !== null)
{
//if not the same that 'original'
if (retValue !== original)
{
$(event.target).text(retValue);
}
else
{
alert("has not been modified" + original);
}
}
else
{
//if click Cancel
alert("has not been modified: " + original_copy);
}
})
</script>
而且還想一次更改整個列。 例如,調用按鈕的onclick()函數:
相同的load_csv.php:
<form>
<input type='button' value="Go back" onClick="history.go(-1);return true;"/>
<!-- if onclick button all values of all cells in the column are changed -->
<br>Column:
<input type='text'/>
<input type='button' value="Change all column?" onClick="myfunction()"/>
</form>
輸出示例: 在此處輸入鏈接描述
任何提示(是的,所有代碼都在同一php.page中。對不起,我的英語不好)?
提前致謝。
編輯:解決方案:我創建了兩個選擇框,一個僅顯示我要更改的列,一個允許我選擇添加兩個值(0或1)。 然后用按鈕調用函數。 這包括選擇框選擇的值。 接下來,我檢查具有0或1和“ Pum”的單個單元格(td)! 成功。
<select name="cols_bool" id="cols_bool">
<option value="not_selected" selected="selected">Choose...</option>
<?php
if (count($col_with_bools) > 0)
{
for ($i = 0; $i < count($col_with_bools); $i++)
{
echo "<option value=".$i.">".$col_with_bools[$i]."</option>";
}
}
?>
</select>
<br>New bool values to insert:
<select name="value_to_replace" id="value_to_replace">
<option value="1" selected="selected">1 (TRUE)</option>
<option value="2">0 (FALSE)</option>
</select>
<input type='button' class="change" value="Change all cells?" onClick="replace()"/>
<script language="javascript" type="text/javascript">
function replace()
{
var column_select = $('#cols_bool option:selected').text();
var value_to_insert = $('#value_to_replace option:selected').text();
$("#tableID").find('tr').each(function(){
var $td = $(this).find('td');
var $td_text = $td.eq(column_select).text();
if ($td_text == '1' || $td_text == '0')
{
$td.eq(column_select).text(value_to_insert.substring(0,1));
}
});
}
</script>
你可以這樣做
function replace(value_to_replace)
{
$("#tableID").find('tr').each(function () {
var $td = $(this).find('td');
$td.eq(3).text(value_to_replace);
});
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.