Drupal 7 表单 api 自定义 javascript 与 Jquery
Drupal 7 Form api Custom javascript with Jquery
我正在使用 Drupal 7 开发一个带有表单 API 的自定义表单和一个带有复选框的表格选择。对于要使用 jquery 编码的复选框的选择,我有一些限制。我为 onclick 复选框创建了一个函数,在 drupal 之外,它的工作原理就像你看到的 HERE,但是当我尝试与 drupal 集成时,jquery 选择器根本不起作用。
所以这是我在 drupal 中的代码:
$form ['#attached'] ['js'] = array (drupal_get_path ( 'module',
'form_cuentacorriente' ) . '/checkboxes.js' );
$form ['tabla'] = array (
'#type' => 'tableselect',
'#header' => $tabla ['header'],
'#options' => $tabla ['body'],
'#attributes' => array ('id' => 'conceptos')
);
这是我的 js 函数:
(function($){
$('input[type=checkbox]').click(function(){
var tabla = $("#conceptos")[0];
var long = tabla.rows.length;
var pos = $(this).closest("tr").index();
if (!this.checked){
for (i = pos+1; i < long +1; i++) {
$(tabla.rows[i]).find( 'input' ).prop('disabled', !this.checked).prop('checked', false);
}
}else{
$(this).closest("tr").next().find("input")
.prop('disabled', !this.checked);
}
});
})(jQuery);
如果我使用 * 选择器,它在我点击的任何地方都有效,但 'input[type=checkbox]' 不起作用。 JQuery Drupal 7 上的 1.10 版本
知道我遗漏了什么吗?
提前致谢!
已解决:由于 Drupal 行为,我只需要像这样包装我的 js 函数:
Drupal.behaviors.form_cuentacorriente = {
attach: function (context, settings) {
$('input[type=checkbox]').click(function(){
var tabla = $("#conceptos")[0];
var long = tabla.rows.length;
var pos = $(this).closest("tr").index();
if (!this.checked){
for (i = pos+1; i < long +1; i++) {
$(tabla.rows[i]).find( 'input' ).prop('disabled',
!this.checked).prop('checked', false);
}
}else{
$(this).closest("tr").next().find("input")
.prop('disabled', !this.checked);
}
});
}
参考:https://www.lullabot.com/articles/understanding-javascript-behaviors-in-drupal
我正在使用 Drupal 7 开发一个带有表单 API 的自定义表单和一个带有复选框的表格选择。对于要使用 jquery 编码的复选框的选择,我有一些限制。我为 onclick 复选框创建了一个函数,在 drupal 之外,它的工作原理就像你看到的 HERE,但是当我尝试与 drupal 集成时,jquery 选择器根本不起作用。
所以这是我在 drupal 中的代码:
$form ['#attached'] ['js'] = array (drupal_get_path ( 'module',
'form_cuentacorriente' ) . '/checkboxes.js' );
$form ['tabla'] = array (
'#type' => 'tableselect',
'#header' => $tabla ['header'],
'#options' => $tabla ['body'],
'#attributes' => array ('id' => 'conceptos')
);
这是我的 js 函数:
(function($){
$('input[type=checkbox]').click(function(){
var tabla = $("#conceptos")[0];
var long = tabla.rows.length;
var pos = $(this).closest("tr").index();
if (!this.checked){
for (i = pos+1; i < long +1; i++) {
$(tabla.rows[i]).find( 'input' ).prop('disabled', !this.checked).prop('checked', false);
}
}else{
$(this).closest("tr").next().find("input")
.prop('disabled', !this.checked);
}
});
})(jQuery);
如果我使用 * 选择器,它在我点击的任何地方都有效,但 'input[type=checkbox]' 不起作用。 JQuery Drupal 7 上的 1.10 版本
知道我遗漏了什么吗?
提前致谢!
已解决:由于 Drupal 行为,我只需要像这样包装我的 js 函数:
Drupal.behaviors.form_cuentacorriente = {
attach: function (context, settings) {
$('input[type=checkbox]').click(function(){
var tabla = $("#conceptos")[0];
var long = tabla.rows.length;
var pos = $(this).closest("tr").index();
if (!this.checked){
for (i = pos+1; i < long +1; i++) {
$(tabla.rows[i]).find( 'input' ).prop('disabled',
!this.checked).prop('checked', false);
}
}else{
$(this).closest("tr").next().find("input")
.prop('disabled', !this.checked);
}
});
}
参考:https://www.lullabot.com/articles/understanding-javascript-behaviors-in-drupal