在 Rails 中的 link_to 方法中添加 onclick 选项？

发布于 2024-12-05 07:20:38 字数 253 浏览 1 评论 0原文

我想向 link_to 方法添加一个 onclick 选项来加载模式对话框...我使用的是 Rails 版本 2.3.8，我在 google 上搜索但无法做到这一点。请有人帮助我吗？

我的link_to方法如下。

<%= link_to 'All countries',{:controller=>'countries', :action=>'new'}, :remote => true %>

原文

I want to add an onclick option to link_to method for loading an modal dialog box...i am using rails version 2.3.8 and i searched on google and could not do it. Plz anybody help me?

My link_to method as follows.

<%= link_to 'All countries',{:controller=>'countries', :action=>'new'}, :remote => true %>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

楠木可依 2024-12-12 07:20:38

如果您使用的是 2.3.8，则没有 :remote =>;真的。如果您尝试执行 ajax 操作，则需要使用 link_to_remote。

所以它看起来像：

<%= link_to_remote 'All countries', :url => {:controller => 'countries', :action => 'new'}%>
<div id="populate_me"></div>

你的新方法必须使用类似

country_controller.rb

def new
  <do something>
  render :update do |page|
    page.replace_html 'populate_me', :partial => 'whatever'
  end
end

UPDATED的

东西来处理ajax请求如果除了ajax操作之外你还想要onclick，你可以将它传递到html选项中：

<%= link_to_remote 'All countries', :url => {:controller => 'countries', :action => 'new'}, :html => {:onclick => 'alert("some javascript executed before ajax")'} %>

If you are using 2.3.8, you don't have :remote => true. You need to use link_to_remote if you are try to do an ajax action.

So it would look something like:

<%= link_to_remote 'All countries', :url => {:controller => 'countries', :action => 'new'}%>
<div id="populate_me"></div>

and your new method would have to handle the ajax request with something like

countries_controller.rb

def new
  <do something>
  render :update do |page|
    page.replace_html 'populate_me', :partial => 'whatever'
  end
end

UPDATED

If you want the onclick in addition to the ajax action, you can just pass it into the html options:

<%= link_to_remote 'All countries', :url => {:controller => 'countries', :action => 'new'}, :html => {:onclick => 'alert("some javascript executed before ajax")'} %>

回复收藏 0 原文

天生の放荡 2024-12-12 07:20:38

您可以将其添加到链接中：

, :class => "pop light", :id => "modal_link"

然后，您的 JS 显示类似以下内容：

<script type="text/javascript">
    $(document).ready(function() {
      $('a.poplight[href^=#]').click(function() {
        var popID = $(this).attr('rel'); //Get Popup Name
        var popURL = $(this).attr('href'); //Get Popup href to define size
        var query= popURL.split('?');
        var dim= query[1].split('&');
        var popWidth = dim[0].split('=')[1]; //Gets the first query string value
        $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
        $('a.close').hide();
        var popMargTop = ($('#' + popID).height() + 80) / 2;
        var popMargLeft = ($('#' + popID).width() + 80) / 2;
        $('#' + popID).css({
            'margin-top' : -popMargTop,
            'margin-left' : -popMargLeft
        });
        $('body').append('<div id="fade"></div>');
        $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
        return false;
      });
      $('a.close').live('click', function() {
          $('#fade , .popup_block').fadeOut(function() {
            $('#fade, a.close').remove(); 
          });
          return false;
      });         
      $('#modal_link').click();
    });
  </script>

You can add this to the link:

, :class => "pop light", :id => "modal_link"

Then, your JS shows something ilke this:

<script type="text/javascript">
    $(document).ready(function() {
      $('a.poplight[href^=#]').click(function() {
        var popID = $(this).attr('rel'); //Get Popup Name
        var popURL = $(this).attr('href'); //Get Popup href to define size
        var query= popURL.split('?');
        var dim= query[1].split('&');
        var popWidth = dim[0].split('=')[1]; //Gets the first query string value
        $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
        $('a.close').hide();
        var popMargTop = ($('#' + popID).height() + 80) / 2;
        var popMargLeft = ($('#' + popID).width() + 80) / 2;
        $('#' + popID).css({
            'margin-top' : -popMargTop,
            'margin-left' : -popMargLeft
        });
        $('body').append('<div id="fade"></div>');
        $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
        return false;
      });
      $('a.close').live('click', function() {
          $('#fade , .popup_block').fadeOut(function() {
            $('#fade, a.close').remove(); 
          });
          return false;
      });         
      $('#modal_link').click();
    });
  </script>

回复收藏 0 原文

~没有更多了~