我有一个表格,上面有数据行.我想通过单击行本身或编辑按钮来编辑大部分行.
假设我有一个列出产品的表格:
我可以通过使用jQuery和jEditable来实现这一点; 并且还使用了jeditable-rails gem.但我一次只能编辑一个单元格.
我需要的是:如果我单击编辑按钮或行本身.表格中的所有这四个单元格都应该可以编辑.
我有一个div,我正在变成一个jEditable控件,代码如下:
$(".ed-fld").editable("/url",
{
placeholder: "(Edit)",
tooltip: "Click to edit",
indicator: "Saving. . ."
}
);
Run Code Online (Sandbox Code Playgroud)
它工作正常.
现在,我想添加一个效果,当控件显示占位符文本时,它会以灰色显示.当控件包含实际文本时,它应遵循常规样式.
这可能通过jEditable吗?
我可能错过了一件容易的事,但是我找不到在JEditable字段中“重置”值的方法。我让用户编辑三个字段,然后按一个按钮将这三个字段保存在一起。这可以正常工作,但是一旦完成,我想重置jEditable字段,使它们没有值并再次显示其占位符。用户输入的三个值显示在其他位置。
我试图做$("#myfield").editable('reset'),但这没用。
我发现的唯一方法是调用.empty()这些字段,并使用回调函数和设置再次将.editable设置为一遍,但是我发现这有点混乱。
还有其他方法吗?
谢谢!
我需要在我的应用程序中使用内联编辑.为此,我使用jQuery的Jeditable插件.
我只想在单击它时触发元素的可编辑模式.这是我的代码不起作用:
var tet = "";
$(".edit-client").click(function(event) {
tet = "#"+event.target.id;
//alert(tet);
});
$(tet).editable("/bestcredit/admin.php/request/editClient", {
submitdata : function (value,settings){
return {"Client[id]":'.$model->client->id.' };
},
//indicator : "Saving...",
//tooltip : "Click to edit...",
submit : "OK",
name : "Client["+tet.substr("1")+"]"
//alert(1);
});
Run Code Online (Sandbox Code Playgroud)
如何添加此功能?
我是Datatables的新手,我正在尝试使表格可编辑,但我不断收到此错误:
TypeError:$(...).dataTable(...).makeEditable不是函数
我的jQuery脚本如下所示:
$(document).ready( function () {
var oTable = $('#data_table_wrapper').dataTable({
"sDom": 'R<"H"lfr>t<"F"ip<',
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"aoColumn": [
{ "bVisible": true },
{ "bVisible": true },
{ "bSortable": false },
]
}).makeEditable({
sUpdateURL: "/abc.php"
});
});
Run Code Online (Sandbox Code Playgroud)
我包括这些文件:
jquery-1.9.1.min.js
jquery.dataTables.min.js
jquery.jeditable.js
jquery.dataTables.editable.js
jquery-ui.js
jquery.validate.js
Run Code Online (Sandbox Code Playgroud)
这些文件的所有链接都能正常工作.请问有人可以给我一些建议吗?为什么我一直收到这个错误?
(如何)在文本区域丢失焦点时,我可以调整jeditable以保存文本吗?如果您不提供提交/取消按钮,那么当按"Enter"时,内容将被保存...但我还没有找到如何保存焦点丢失的内容.
我正在使用jeditable但是想使用一个函数来保存客户端上的数据.这工作正常,但我也想使用函数来处理onblur事件.我的代码如下:
$('#answerlist li').editable(function(value, settings) {
OnAnswerTextEdit(this, value);
return (value);
}, { onblur: function(value) {
OnAnswerTextEdit(this, value);
}
});
Run Code Online (Sandbox Code Playgroud)
它有点工作,但是在onblur事件之后,jeditable编辑窗口不会关闭.有没有人知道如何在失去焦点时关闭编辑会话,或者在编辑文本框失去焦点时以某种方式通过函数获取我的更改.我不想随时提交表格 - 我希望将所有更改保留在本地.非常感谢.
我有以下字符串,其中包含几个元素:
'<span class="fn" id="fn1">Matthew</span>
<span class="spouse" id="spouse1">Evelyn Ross</span>
<span class="bday" id="bday1">1456</span>
<span class="wday" id="wday1"></span>
<span class="dday" id="dday1">2000</span>'
Run Code Online (Sandbox Code Playgroud)
将此解析为5个变量的最佳方法是什么?
编辑
为清楚起见,这里是完整的代码,我正在为jEditable创建一个自定义输入类型,允许我内联编辑一个vcard.
$.editable.addInputType('person', {
element : function(settings, original) {
var fn = $('<input id="fn_"/>');
var bday = $('<input id="bday_" />');
var wday = $('<input id="wday_" />');
var dday = $('<input id="dday_" />');
var spouse = $('<input id="spouse_" />');
$(this).append(fn);
$(this).append(bday);
$(this).append(wday);
$(this).append(dday);
$(this).append(spouse);
/* Hidden input to store value which is submitted to server. */
var hidden = $('<input type="hidden">');
$(this).append(hidden);
return(hidden); …Run Code Online (Sandbox Code Playgroud) 解
感谢Arman的P.概念验证,终于让它与我的网站一起工作了.
码
//Edit Note
$(function(){
function makeEditable() {
$(".edit").editable('ajax/save.php?editnotetext', {
type : 'mce',
submit : '<button class="save_button">Save</button>',
event: 'dblclick',
indicator : 'Saving...',
tooltip : 'Doubleclick to edit...',
onblur: 'ignore',
width : '700px',
height : '100px',
callback : function(value, settings){
console.log('unlocked');
$.post('ajax/save.php?unlocknotetext', {"id" : $(this).attr('id')});
$(this).effect("highlight", {}, 3000);
$(this).parents('.panel').effect("highlight", {}, 3000);
},
'onreset' : function(){
console.log('unlocked');
$.post('ajax/save.php?unlocknotetext', {"id" : $(this).attr('id')});
}
});
};
makeEditable();
$('.edit').live('click', function() {
console.log('locked');
$.post('ajax/save.php?locknotetext', {"id" : $(this).attr('id')});
});
$(".edit").click(function() {
$.post('ajax/save.php?checklock', {"id" : $(this).attr('id')},
function(data) …Run Code Online (Sandbox Code Playgroud) 好的,我是MySQL和PHP的新手,但是可以在这里使用一些帮助。
宏伟的愿景:一个充满可编辑字段的大页面(我正在使用Jeditable,它是就地编辑的jquery插件),可将值存储到MySQL数据库同一行中的不同字段。
我完全迷失了如何正确地将值发布到MySQL数据库的不同字段。下面是我所拥有的;它源自Jeditable提供的示例。我可以在字段中输入数据,但会保存字段的ID(而不是数据),并将其附加到数据库的多个列中,而不是一个正确的列中。
因此,简而言之-如何将您在此处看到的内容映射到我的MySQL数据库的不同位置(例如:一个具有客户名称值,尺寸值,初始销售价值的MRR的订单项/记录?)
这是我的HTML-
<!-- JQuery to extract form data... -->
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#paragraph_1').editable('save.php');
});
$(document).ready(function() {
$('#custsize').editable('save.php');
});
$(document).ready(function() {
$('#mrratsale').editable('save.php');
});
</script>
<!-- my form fields... -->
<h2 id="paragraph_1" name="paragraph_1"></h2>
<h3 id="custsize" name="custsize"></h3>
<h3 id="mrratsale" name="mrratsale"></h3>
Run Code Online (Sandbox Code Playgroud)
...这是我的save.php文件...
<?php
require_once 'config.php';
$query=sprintf("INSERT INTO customerdata (ListItemID, CustName, CustSize, MrrAtSale)
VALUES (%d, '%s', '%s', '%s')",
$id, $_POST['id'], $_POST['id'], $_POST['id'], stripslashes($_POST['value']));
$dbh->exec($query);
/* What is echoed back will be shown in webpage after editing.*/
print $_POST['value'];
?>
Run Code Online (Sandbox Code Playgroud)
任何帮助都将是非常非常感谢的(并且不要笑!)