- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试连接 jQuery 插件 http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/与 Catalog_Products 表,我做到了。我将此代码(jQuery 代码)注入(inject)到 grid.js 文件中:
...
initGrid : function(){
if(this.preInitCallback){
this.preInitCallback(this);
}
if($(this.containerId+this.tableSufix)){
this.rows = $$('#'+this.containerId+this.tableSufix+' tbody tr');
for (var row=0; row<this.rows.length; row++) {
if(row%2==0){
Element.addClassName(this.rows[row], 'even');
}
Event.observe(this.rows[row],'mouseover',this.trOnMouseOver);
Event.observe(this.rows[row],'mouseout',this.trOnMouseOut);
Event.observe(this.rows[row],'click',this.trOnClick);
Event.observe(this.rows[row],'dblclick',this.trOnDblClick);
if(this.initRowCallback){
try {
this.initRowCallback(this, this.rows[row]);
} catch (e) {
if(console) {
console.log(e);
}
}
}
}
}
if(this.sortVar && this.dirVar){
var columns = $$('#'+this.containerId+this.tableSufix+' thead a');
for(var col=0; col<columns.length; col++){
Event.observe(columns[col],'click',this.thLinkOnClick);
}
}
this.bindFilterFields();
this.bindFieldsChange();
if(this.initCallback){
try {
this.initCallback(this);
}
catch (e) {
if(console) {
console.log(e);
}
}
}
// Drag and drop
jQuery(document).ready(function() {
// Initialise the table
jQuery("#catalog_category_products_table tbody").tableDnD({
onDrop: function() {
jQuery("#catalog_category_products_table tbody tr").each(function(index) {
jQuery("#catalog_category_products_table tbody tr td input.input-text:eq("+index+")").removeAttr('value');
jQuery("#catalog_category_products_table tbody tr td input.input-text:eq("+index+")").attr('value', index + 1);
});
}
});
});
},
getContainerId : function(){
return this.containerId;
},
...
删除后,我执行排序函数对输入值进行排序,例如 1,2...这工作正常。问题是,当我保存这个产品时,新的输入值没有保存,我认为这是因为 magento 我使用了一些按键,更改了绑定(bind)功能。我将非常感谢您帮助我解决这个问题。
最佳答案
我不确定将 jQuery 包含到管理面板中是否有意义,只是为了使用这个组件。 Magento 已经提供了 Prototype + Scriptaculous,您甚至不需要启用它们。您可以使用的组件是 Sortable,它可以完成您需要的所有操作: http://madrobby.github.com/scriptaculous/sortable-create/
修改grid.js文件也不是一个好主意,您可以轻松地将任何类方法包装在prototypejs框架中。为此,您可以通过布局更新来包含具有以下内容的自定义 JS 文件:
varienGrid = Class.create(varienGrid, {
initGrid: function ($super) {
$super(); // Calling parent method functionality
// Doing your customization
}
});
在这种情况下,此页面上实例化的所有网格对象都将调用您的自定义方法代码,并且您的代码的可升级性是安全的。
对于您的特定情况,代码可能如下所示:
varienGrid = Class.create(varienGrid, {
initGrid: function ($super) {
$super(); // Calling parent method functionality
var table = $(this.containerId+this.tableSufix);
this.sortedContainer = table.down('tbody');
Sortable.create(this.sortedContainer.identify(), {
tag: 'TR',
dropOnEmpty:true,
containment: [this.sortedContainer.identify()],
constraint: false,
onChange: this.updateSort.bind(this)
});
},
updateSort: function ()
{
var rows = this.sortedContainer.childElements(); // Getting all rows
for (var i = 0, l = rows.length; i < l; i++) {
// Check if input is available
if (rows[i].down('input[type="text"]')) {
rows[i].down('input[type="text"]').value = i + 1;
// Updating is changed flag for element
rows[i].down('input[type="text"]').setHasChanges({});
}
}
}
});
此外,对于元素,其中一些元素可能会被禁用并且不会被处理。您可以在 updateSort 方法中调试每个元素。
享受 Magento 开发的乐趣!
关于jquery - Magento Catalog_Products 在管理中使用 jQuery 拖放表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11967656/
这个问题在这里已经有了答案: Difference between Property and Field in C# 3.0+ (10 个答案) 关闭 10 年前。 我不明白静态属性之间的区别: p
当元素被拖放时,有没有办法从被拖动的元素中获取 id(或其他属性值)? 例如,在左侧,我有一堆 div,我可以将图像放入其中。右边有一个 div 用来保存图像。当我将图像从右侧拖动到左侧的 div 时
每当我更改其中一个类属性时,我想设置一个修改标志,如下所示 public bool Modified { get; set; } public bool Enabled { get; set { Mo
由于某种原因,我下面的代码曾经可以正常工作,但现在却引发了一个异常: public static async Task HttpPut(string inUrl, string inFilePath)
为什么将 ; 放在最佳实践中?在函数定义的末尾。 例如 var tony = function () { console.log("hello there"); }; 优于: var tony
我在容器内有一个位图。当我拖动容器时,光标变为编辑文本形状,图像也跳到光标的右下角(好像我从左上角拿着图像并拖动它)。 这是我的代码,所以你可以看到我有 RTFM: function createIc
这个问题已经有答案了: C# 3.0 auto-properties — useful or not? [closed] (17 个回答) 已关闭 6 年前。 当我让 Visual Studio 20
以类中的以下代码为例: public class Employee : IEntity { public string FirstName { get; set; } public s
我有 json 数据: { "products": [ { "productId" : 0, "productImg" : "../img/product-ph
这个问题在这里已经有了答案: What is the difference between a field and a property? (33 个答案) 关闭 9 年前。 我在一本书上找到这样声
我正在设置多个方法,想知道如何继续将一个变量(“顶部”变量)传递给不同的方法。 主要方法: public static void Main(string[] args) { i
我正在尝试使用 crontab 编写一个简单的任务,将一些文件从本地复制到 HDFS。我的代码是这样的: #!/bing/ksh ANIO=$(date +"%Y") MES=$(date +"%m"
有人可以告诉我如何使用这个解决方案来解决我的问题吗?我也想限制 id 中包含文本“not”的节点的拖/放。 jsTree drag and drop restrict folders by class
我的情况如下 - 我正在对可能包含链接行的表进行排序: row 1 row 2 row 3 row 4 row 5 我需要的是禁止在.linked-to-p
我想知道是否有人知道是否有一个预先制定的解决方案:我在 ASP.net 网站上有一个列表,我希望用户能够通过拖放对列表进行重新排序。此外,我希望有第二个列表,用户可以将第一个列表中的项目拖到其中。 到
我在理解似乎不一致的方案中的破坏性操作时遇到问题。即为什么下例中bar没有变化 (define foo '(a b)) (define bar foo) (set! foo '(c d)) foo >
我想知道是否有人知道是否有一个预先制定的解决方案:我在 ASP.net 网站上有一个列表,我希望用户能够通过拖放对列表进行重新排序。此外,我希望有第二个列表,用户可以将第一个列表中的项目拖到其中。 到
我在理解似乎不一致的方案中的破坏性操作时遇到问题。即为什么下例中bar没有变化 (define foo '(a b)) (define bar foo) (set! foo '(c d)) foo >
我在我的 Web 应用程序中使用 Ajax ControlToolkit 中的 ModalPopupExtender。我将其 Drag 属性设置为 true,但是当我拖动弹出面板并将其放到新位置时,它
所以,基于this answer ,我有一组可以拖放并卡入到位的 div。唯一的问题是,可拖动的 div 具有不同的高度,我需要它们始终捕捉到目标的底部,而不是顶部。 您可以在this JsFiddl
我是一名优秀的程序员,十分优秀!