[英]Codeigniter get the value of a <td> element onclick
当用户单击元素内的文本时,我试图获取表数据。 我尝试了一些Java脚本,但无法获取将其发送回控制器进行进一步处理的值。 如果您能帮助我,我将不胜感激。 我添加了必要的代码供您查看我是否做错了什么。
<div class="box-content">
<table id="suppliertable" class="table table-striped table-bordered bootstrap-datatable datatable">
<thead>
<tr>
<th>Supplier</th>
<th>Open Range</th>
<th>Fill Content</th>
<th>Total Match</th>
</tr>
</thead>
<tbody>
<?php foreach($present_all_suppliers as $v): ?>
<tr>
<td class="center" style="color:#0c595b;"><?php echo $v->supplierCompany;?> </a> </td>
<td class="center">70%</td>
<td class="center">12%</td>
<td class="center">82%</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
Java脚本:
document.getElementById ( "tdid" ).textContent
var tdElem = document.getElementById ( "tdid" );
var tdText = tdElem.innerText | tdElem.textContent;
您需要将数据从Javascript传递回控制器。 这意味着,当用户单击有问题的<td>
,必须将AJAX请求发送到适当的控制器,然后该控制器可以执行某些服务器操作或返回一些将由AJAX回调函数使用的数据。
这是一个示例: http : //www.w3schools.com/php/php_ajax_php.asp
这显示了如何使用AJAX和PHP对HTML DOM对象进行动态更改。
这是关于onclick以及AJAX和PHP的关于stackoverflow的另一个问题: 在onClick HTML事件之后调用PHP函数
您需要学习的是AJAX,以及如果您想使页面的外观和风格更加现代(HTML5),如何构建应用程序以使用它。
这将需要一些漂亮的ajax和一个javascript附件。 希望这个例子会有所帮助。
http://jsfiddle.net/qpe2wrmt/1/
function addEventHandler(elem,eventType,handler){
if (elem.addEventListener)
elem.addEventListener(eventType,handler,false);
else if (elem.attachEvent)
elem.attachEvent ('on'+eventType,handler);
}
var items = document.getElementsByClassName("clickable");
i = items.length;
while(i--){
(function(item){
addEventHandler(item,"click",function(){
// make your ajax call here
window.alert("clicked on a thing: "+item.innerHTML);
});
})(items[i]);
}
1)在您想成为可疑对象的每个td中添加一个“ clickable”类
2)按类名遍历所有可单击的项,并为每个项分配一个事件处理程序。
3)单击时发出XHR请求。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.