在Drupal Ajax提交电话之前,我如何运行客户端验证? -- 7 领域 和 ajax 领域 和 javascript 领域 drupal 相关 的问题

How can I run client side validation before a Drupal AJAX submit call?


2
vote

问题

中文

我正在尝试使用jQuery.Validate.js在通过Ajax提交的表单上执行客户端验证(使用表单操作),但由于某种原因,不触发客户端验证。

这就是我的template.php文件中所拥有的内容才能触发AJAX呼叫登录:

  $form['actions']['submit']['#ajax'] = array(     'callback' => 'fantasia_user_login_ajax_callback', 'wrapper' => 'user-login-form',     'event' => 'mousedown',  );   

和这里是我的JS触发客户端验证:

  (function ($) { Drupal.loginAjax = {     form_id: 'user-login-form' };   Drupal.behaviors.loginAjax = {      attach: function (context ,settings) {                Drupal.loginAjax.beforeSubmit = function (form_values, form, options) {                 $("form#user-login-form", context).validate({                      rules: {                         edit_pass: "required",                         edit_name: "required"                                          },                                    messages: {                          edit_name: {                              required: "E-mail Address is required"                         }                     }                 });                           }          for (ajax_el in settings.ajax) {             if (Drupal.ajax[ajax_el].element.form) {                 if (Drupal.ajax[ajax_el].element.form.id == Drupal.loginAjax.form_id) {                                          Drupal.ajax[ajax_el].beforeSubmit = Drupal.loginAjax.beforeSubmit;                 }             }         }      } }; })(jQuery);   

触发beforesubmit方法,因为当我打印到控制台时,我会得到一个值。

在旁边,我尝试使用beforesd这样做。客户端验证确实触发,但提交不会被停止。

任何指针?

英文原文

I'm trying to perform client side validation using jquery.validate.js on a form submitted via Ajax (using form actions), but for some reason, the client side validation is not being triggered.

This is what I have in my template.php file in order to trigger an ajax call for login:

$form['actions']['submit']['#ajax'] = array(     'callback' => 'fantasia_user_login_ajax_callback', 'wrapper' => 'user-login-form',     'event' => 'mousedown',  ); 

And here's my js to trigger the client side validation:

(function ($) { Drupal.loginAjax = {     form_id: 'user-login-form' };   Drupal.behaviors.loginAjax = {      attach: function (context ,settings) {                Drupal.loginAjax.beforeSubmit = function (form_values, form, options) {                 $("form#user-login-form", context).validate({                      rules: {                         edit_pass: "required",                         edit_name: "required"                                          },                                    messages: {                          edit_name: {                              required: "E-mail Address is required"                         }                     }                 });                           }          for (ajax_el in settings.ajax) {             if (Drupal.ajax[ajax_el].element.form) {                 if (Drupal.ajax[ajax_el].element.form.id == Drupal.loginAjax.form_id) {                                          Drupal.ajax[ajax_el].beforeSubmit = Drupal.loginAjax.beforeSubmit;                 }             }         }      } }; })(jQuery); 

The beforeSubmit method is being triggered because when I print to the console, I do get a value.

On a sidenote, I've tried doing this using the beforeSend instead. The client side validation does trigger, but the submit is not being halted.

Any pointers please?

        
 
 

回答列表

4
 
vote
vote
最佳答案
 

我会尝试通过更改事件类型并自行触发提交来劫持提交表单。

例如:

  $form['actions']['submit']['#ajax'] = array(     'callback' => 'fantasia_user_login_ajax_callback', 'wrapper' => 'user-login-form',     'event' => 'submitmyform',  );   

然后只添加自己的点击或表单处理程序。一旦您对验证感到满意,只需触发事件"submitmyform" 。例如:

  Drupal.behaviors.loginAjax = {    attach: function (context ,settings) {      // Cache the form object     var $form = $("form#user-login-form", context);     var $submitButton = $('input[type="submit"]', $form);      // Use once so we dont attach submit multiple times     // Use off to remove any existing submit handler     $form       .once('loginAjax')       .off('submit')       .on('submit', function(e){       e.preventDefault();       var $form = $(this);        // Run validation on $form object.        // If success, trigger event on button       if(valid) {         $submitButton.trigger('submitmyform');       }     });   } }   

我没有测试这个代码,但实质上这就是我建议你接近它而不是用Ajax对象本身搞乱。

 

I would attempt to hijack the submit form by changing the event type and triggering the submission yourself.

For example:

$form['actions']['submit']['#ajax'] = array(     'callback' => 'fantasia_user_login_ajax_callback', 'wrapper' => 'user-login-form',     'event' => 'submitmyform',  ); 

Then just add your own click or form handler. Once you happy with the validation simply trigger the event "submitmyform". For example:

Drupal.behaviors.loginAjax = {    attach: function (context ,settings) {      // Cache the form object     var $form = $("form#user-login-form", context);     var $submitButton = $('input[type="submit"]', $form);      // Use once so we dont attach submit multiple times     // Use off to remove any existing submit handler     $form       .once('loginAjax')       .off('submit')       .on('submit', function(e){       e.preventDefault();       var $form = $(this);        // Run validation on $form object.        // If success, trigger event on button       if(valid) {         $submitButton.trigger('submitmyform');       }     });   } } 

I have not tested this code but in essence this is how I recommend you approach it rather than messing around with the ajax object itself.

 
 
 
 
1
 
vote

这是愚蠢的,但它有效,只需添加 'event=>'onsubmit' 。它将在Drupal代码中解决jQuery事件优先级的问题。

  $form['actions']['submit']['#ajax'] = array(     'callback' => 'fantasia_user_login_ajax_callback',     'wrapper' => 'user-login-form',     'event' => 'onsubmit',  );   
 

This is stupid but it works, just add 'event=>'onsubmit'. It will fix a problem with the jQuery event priority in drupal code.

$form['actions']['submit']['#ajax'] = array(     'callback' => 'fantasia_user_login_ajax_callback',     'wrapper' => 'user-login-form',     'event' => 'onsubmit',  ); 
 
 

相关问题

2  如何在视图中显示节点的域所有者?  ( How do i display the domain owner of a node in a view ) 
我有一个观点,它会生成一个显示即将到来的事件的块。在主站点上,这些事件可能来自多个域(该网站使用域访问),我想将域所有者显示为他们网站子域的链接。 示例: Aug. 14 - Sample Event Domain Owner (http://owner.mydomain.com) 有没有办法可以直接将此添...

1  如何在使用Google图表工具模块创建的图表上更改标签?  ( How can i change the labels on a chart created with the google chart tools modul ) 
我正在使用 chart 模块和 google图表工具模块从注册用户收集的数据中创建图表。 这是我的图表的样本: 但是如何更改x轴的标签? ,我希望标题出现在x轴上,而不是链接。我该怎么办? ...

0  如何在“由”字段上的“提交”字段上插入用户图片的缩略图?  ( How do i insert a user pictures thumbnail on the submitted by field ) 
我想在"字段中" 字段中插入"用户图片" 缩略图,该缩略图显示在"下面的预告片" 中。 由xx / xx / xx上的[some_user] [有点图片的缩略图]提交 如何尽可能轻松地做到这一点? ...

4  禁用Drupal 7叠加以获取某些管理链接  ( Disable the drupal 7 overlay for some administrative links ) 
有没有办法禁用Drupal 7覆盖以不管某些管理链接不是其他人吗? 用于可用原因,我正在努力的网站将从某些管理链接中受益,使用默认覆盖行为,而1或2将受益于禁用它。由于绝大多数链接对用户来说更有意义,因为用户在叠加层中经历,我希望它一般为它们提供启用,但能够保留一些特定的链接禁运,因此JavaScript不会更新他们...

2  显示旧价格与线路  ( Show old price with line through ) 
我有drupal 7,没有安装鼠标商务模块,因为我们也是电子商务的地方。对于某些项目,我们需要显示两个价格(Old_Price和New_Price)。仅针对remop_price填充的项目,我需要显示old_price行 - 槽或顶部x。我想我需要在某个地方放一些代码,但在哪里? 我一直在寻找一个模块,但所有模块都是...

2  如何替换数据库中已存在的值?  ( How can i replace a value already present in the database ) 
是否有一种方法是 998887661 覆盖现有条目? ...

2  您在哪里存储任意主页数据? [关闭]  ( Where do you store arbitrary home page data ) 
此问题似乎在帮助中心中定义的范围内涉及Drupal。 想要改进这个问题?更新问题,所以它是关于drupal答案的主题。 ...

1  民意调查规则集成  ( Poll rules integration ) 
如何将核心轮询模块与规则集成? 我找到了 advpoll 我想在投票上投票后简单地触发规则。 是否有任何替代方案来实现相同的功能? ...

0  将JS脚本添加到注册页面  ( Add js script to register page ) 
就像标题一样,我试图将脚本添加到我的寄存器页面上,我正在使用zen作为我的主题,我将一个脚本添加到.info文件中,并只测试它我已添加一个 alert() 函数,它只是关于除默认寄存器页面之外的所有页面,我不知道为什么,它只是不打电话剧本根本。 更长的版本是我有一个定制的Drupal网站,而不是用于公共使用的,只需针...

0  如何将我的模块模板制作给主题  ( How can i make my module templates available to a theme ) 
在我的模块中,我使用 hook_theme 指定我使用的一些自定义模板。 它们在这里存储。 sites - all - modules - mymodule - mytemplatefile.tpl.php 有没有办法在模板目录中放入 mytemplatefile.tpl.php ,并让...

0  是否有一个模块可以像Live CSS一样编辑PHP?  ( Is there a module to edit php just like live css ) 
我下载了Live CSS,似乎非常适合编辑。我是Drupal新的,我不知道存储PHP文件的所有位置。是否有任何模块来编辑PHP,就像CSS的实际情况一样? :请任何帮助将是必不可少的 ...

0  基于主要内容类型的显示块视图  ( Display block based on main content type with view ) 
我在块中创建了一个视图,以向当前内容类型显示将一些相关信息显示在块中。更准确地说,我想仅显示块的书页。 我所做的是基于内容类型添加上下文过滤器。 对于"当过滤器值不可用" 时,我为"PHP上下文过滤器代码" 提供了如下所示的默认值 $node = node_load(arg(1)); return $node->...

3  为什么观点php给我null for $行 - >路径?  ( Why does views php give me null for row path ) 
我有一个视图块,只能显示一些节点的标题。链接到单个节点的标题。当链接路径与实际称为路径匹配时,我希望在标题的链接中添加CSS类 .active 。如下面的评论中所述,默认情况下我没有那个类。 所以我在添加并排除了 Content: Path Global: PHP中 $row->path 99887667 $r...

2  为什么我的javascript运行?  ( Why doesnt my javascript run ) 
我正在尝试根据点击的节点更改颜色框的背景颜色(其中呈现节点)。查看 https:/ /stackoverflow.com/questions/18173943/change-background-color-of-colorbox-using-js-based-on-node -did?noredirect=1#co...

1  特定时间/小时的预定站点备份  ( Scheduled site backup at specific time hour ) 
如何在共享主机上的特定小时内安排Drupal站点(尤其是数据库)的备份?我正在使用备份迁移模块,但它不支持小时,只有频率。它目前在晚上8点左右制作日常备份。 我检查了这个 shell脚本,可以添加到Cron我认为,但它没有备份后发送邮件,不允许为缓存表指定"仅结构" 。 ...

2  图像系统帮助  ( Image system help ) 
drupal新的,但我发现它非常惊人。 我已经从另一个站点导入了超过4000篇文章。目前,我已经为所有这些文章进行了"过滤了HMTL" 。 它们具有HTML图像代码(图像从外部源发布) 它看起来像这样: <img width="350" align="left" src="http://***********"...

1  自定义日期格式无法使用我的日期字段  ( Custom date format not available to my date field ) 
我确信我错过了一些超级简单的东西,但由于某种原因,我创建的日期字段无法在视图中使用"自定义格式" 选项。我正在使用D7 7.22和日期模块,7.x.2.6 我注意到我创建的字段的标有不同于"内容:发布日期" 的正常日期字段。 矿被标记,"选择用户的日期和时间" 常规字段只标记为"日期格式" 我创建了一个包含为每...

0  在jQuery手风琴中包裹一个块  ( Wrapping a block in jquery accordion ) 
问题 我正在为模块创建搜索页面。在该页面上,我有一个暴露的视图过滤器块,我想把它放入jQuery手风琴。 如果它在筛选器块下方的相同侧边栏中的相关性:我有一系列使用 Facet API可折叠模块。 此刻我将脚本"facetackaccians.js" 放在MyTheme / JS中/并使用.info文件添加它。...

1  如何将内容类型的查询更改为D6到D7?  ( How to change the query for content type in d6 to d7 ) 
我在d6中有一个代码,如下所述,如下所示 在Drupal 6对于每种内容类型,我们有一个单独的表,如content_type_ [content_name] ---------------------------------- SELECT nid, field_id_value, field_oid_...

0  如何在寻呼机中添加图像的图像,以查看Nivo Slider?  ( How do i add images in pager for views nivo slider ) 
我正在使用视图nivo滑块在我的网站上显示横幅图像的幻灯片。我希望以图像的形式显示寻呼机。我尝试使用视图幻灯片的图像寻呼机幻灯片,它在那里工作。但是没有特定于添加图像预设的设置。我能够添加数字而不是子弹。请建议特别添加图像的方法。 ...




© 2021 it.wenda123.org All Rights Reserved. 问答之家 版权所有


Licensed under cc by-sa 3.0 with attribution required.