请教一个后台表单编辑问题
这是从数据库循环读取的文件,怎么点修改,左边对应的内容出现编辑状态?(点第一行编辑,张先生出现编辑框,第二行编辑,陈先生出现编辑框...)这是我写的代码,但是不知道怎么修改对应某行。
php代码
while($row=mysql_fetch_array($result)){
)"/>
}
js代码
<script> <br /> function changeOrderTime(){ <br /> var spanValue = $("#OrderTime").text(); <br /> $("#OrderTimeInput").val(spanValue); <br /> $("#OrderTimeInput").show(); <br /> $("#OrderTime").hide(); <br /> $("#changeOrderTime").hide(); <br /> $("#timeChangeOK").show(); <br /> } <br /></script>
回复讨论(解决方案)
错误太多,也没守规矩
至少需要这样写
<table><tr><td height="30px" align="center"><span id="OrderTime">张先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(1)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">陈先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(2)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">李先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(3)"/></td> </tr></table><script src=scripts/jquery-1.8.3.min.js></script><script>$(function() { $('.changeOrderTime').click(function() { var e = $(this).parents('tr'); e.find('#OrderTimeInput').val(e.find('#OrderTime').text()); e.find('#OrderTime').hide(); e.find('#OrderTimeInput').show(); e.find('#timeChangeOK').show(); $(this).hide(); });});</script>
jquery 允许 id 有条件重复,但必须指明上级容器
你可以设置ID,然后通过传参带入,获取INPUT修改后的值
错误太多,也没守规矩
至少需要这样写
<table><tr><td height="30px" align="center"><span id="OrderTime">张先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(1)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">陈先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(2)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">李先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(3)"/></td> </tr></table><script src=scripts/jquery-1.8.3.min.js></script><script>$(function() { $('.changeOrderTime').click(function() { var e = $(this).parents('tr'); e.find('#OrderTimeInput').val(e.find('#OrderTime').text()); e.find('#OrderTime').hide(); e.find('#OrderTimeInput').show(); e.find('#timeChangeOK').show(); $(this).hide(); });});</script>
jquery 允许 id 有条件重复,但必须指明上级容器[/quo
错误太多,也没守规矩
至少需要这样写
<table><tr><td height="30px" align="center"><span id="OrderTime">张先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(1)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">陈先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(2)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">李先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(3)"/></td> </tr></table><script src=scripts/jquery-1.8.3.min.js></script><script>$(function() { $('.changeOrderTime').click(function() { var e = $(this).parents('tr'); e.find('#OrderTimeInput').val(e.find('#OrderTime').text()); e.find('#OrderTime').hide(); e.find('#OrderTimeInput').show(); e.find('#timeChangeOK').show(); $(this).hide(); });});</script>
jquery 允许 id 有条件重复,但必须指明上级容器
这样一条一条分条写我明白,我是这样举例的,实际数据有几万条,肯定不能这样写吧?只能从数据库循环读取,但是读取出来之后我就不知道怎么用这种方法编辑了,可以做到去另外一个网页去编辑,把ID传过去就可以了。对JS不熟悉,版主可以写一个具体的程序么?
我不过是给个可供测试的例子,用来指出你的代码的问题
从数据库循环读取,并不意味就可以不遵守规则
我不过是给个可供测试的例子,用来指出你的代码的问题
从数据库循环读取,并不意味就可以不遵守规则
我知道程序写的有问题,可能是我没问好,PHP代码我本来是写成这样的
while($row=mysql_fetch_array($result)){
)"/>
}
只是单单的把数据从数据库中循环读出来了,因为要添加修改功能,我想用JS实现上面那种的编辑效果,代码不知道怎么写,版主能教下这段代码怎么写么?
示例代码已经给过你了
你写的之所以不成功,原因是你违背的 id 唯一 的原则:
循环中
必将重复出现
示例代码已经给过你了
你写的之所以不成功,原因是你违背的 id 唯一 的原则:
循环中
必将重复出现[/quote
我懂了,你一开始就回答的很清楚了!对jQuery 遍历 - parents() 方法不清楚,百度了下明白了!
示例代码已经给过你了
你写的之所以不成功,原因是你违背的 id 唯一 的原则:
循环中
必将重复出现
在问一个问题,我用同样的方法无法保存修改的数据是为什么
$(function() {
$('.changeOrderTime').click(function() {
var e = $(this).parents('tr');
e.find('#OrderTimeInput').val(e.find('#OrderTime').text());
e.find('#OrderTime').hide();
e.find('#OrderTimeInput').show();
e.find('.timeChangeOK').show();
$(this).hide();
});
});
$(function() {
$('.timeChangeOK').click(function() {
var e = $(this).parents('tr');
e.find('#OrderTime').val(e.find('#OrderTimeInput').text());
e.find('#OrderTimeInput').hide();
e.find('#OrderTime').show();
e.find('.changeOrderTime').show();
$(this).hide();
});
});
你没有提交,怎么保存?
你没有提交,怎么保存?
就是想知道点击确定后怎么获取到修改的数据,然后保存到数据库。
你没有提交,怎么保存?
研究出来了,这是我写的完整程序,结贴!
function edit_oper(id){
$('.changeOrderTime').click(function(){
var e = $(this).parents('tr');
e.find('#OrderTimeInput').val(e.find('#OrderTime').text());
e.find('#OrderTime').hide();
e.find('#OrderTimeInput').show();
e.find('.timeChangeOK').show();
$(this).hide();
});
$('.timeChangeOK').click(function(){
var e = $(this).parents('tr');
e.find('#OrderTime').text(e.find('#OrderTimeInput').val());
e.find('#OrderTimeInput').hide();
e.find('#OrderTime').show();
e.find('.changeOrderTime').show();
$(this).hide();
var up = e.find('#OrderTime').text();
$.ajax({
type:"GET",
url:'edit.inc.php?action=oper&id='+id,
data:{operator : up},
success:function(msg){
if(msg == "success"){
alert("修改成功");
history.go(0) ;
}else{
if(msg == "error1"){
alert("修改失败");
return false;
}
}
}
});
});
}

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

Long URLs, often cluttered with keywords and tracking parameters, can deter visitors. A URL shortening script offers a solution, creating concise links ideal for social media and other platforms. These scripts are valuable for individual websites a

Following its high-profile acquisition by Facebook in 2012, Instagram adopted two sets of APIs for third-party use. These are the Instagram Graph API and the Instagram Basic Display API.As a developer building an app that requires information from a

Laravel simplifies handling temporary session data using its intuitive flash methods. This is perfect for displaying brief messages, alerts, or notifications within your application. Data persists only for the subsequent request by default: $request-

This is the second and final part of the series on building a React application with a Laravel back-end. In the first part of the series, we created a RESTful API using Laravel for a basic product-listing application. In this tutorial, we will be dev

Laravel provides concise HTTP response simulation syntax, simplifying HTTP interaction testing. This approach significantly reduces code redundancy while making your test simulation more intuitive. The basic implementation provides a variety of response type shortcuts: use Illuminate\Support\Facades\Http; Http::fake([ 'google.com' => 'Hello World', 'github.com' => ['foo' => 'bar'], 'forge.laravel.com' =>

The PHP Client URL (cURL) extension is a powerful tool for developers, enabling seamless interaction with remote servers and REST APIs. By leveraging libcurl, a well-respected multi-protocol file transfer library, PHP cURL facilitates efficient execution of various network protocols, including HTTP, HTTPS, and FTP. This extension offers granular control over HTTP requests, supports multiple concurrent operations, and provides built-in security features.

Do you want to provide real-time, instant solutions to your customers' most pressing problems? Live chat lets you have real-time conversations with customers and resolve their problems instantly. It allows you to provide faster service to your custom

The 2025 PHP Landscape Survey investigates current PHP development trends. It explores framework usage, deployment methods, and challenges, aiming to provide insights for developers and businesses. The survey anticipates growth in modern PHP versio
