微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

ruby-on-rails – 在表单提交错误后显示基于ajax的元素

我的表单中有两个选择元素,分类和子类别.首先,仅显示类别选择.当用户在类别选择中进行选择时,将向服务器发送 AJAX请求,并显示子类别选择.它工作正常.

现在,当表单提交时出现一些错误,由于任何事情,缺少一些所需的值,或者任何东西,我都会显示错误信息,但我不能保留选择框的相同状态,我只看到类别选择,没有选择值,即初始状态.任何人都可以建议我如何保持这些选择元素的状态?

这是我新表单中的代码段:

<div id="category-select">
    category <%= collection_select :post_category,:id,@categories,:name,options = {:prompt => "Select a category"} %>
    </div>
    <div id="sub-category-select">
    </div>

这是我的jQuery脚本,当在Category选择上进行选择时发送AJAX请求:

$("#post_category_id").change(function() {
  var category_id = $('select#post_category_id :selected').val();
  if(category_id == "") category_id="0";
    $.get('/posts/update_sub_cat/' + category_id,function(data){
       $("#sub-category-select").html(data);
    })
  return false;
});

AJAX请求是在post_controller中的update_sub_cat动作上进行的,如下所示:

def update_sub_cat
  if params[:id].present?
    @sub_categories = Category.find_all_by_parent_id(params[:id])
  else
    @sub_categories = []
  end
  respond_to do |format|
    format.js
  end

结束

AJAX请求呈现update_sub_cat.js.erb文件,其中我使用了一些HMTL

sub-category <%= collection_select :post_sub_category,@sub_categories,options = {:prompt => "Select a sub-category"} %>

我知道,我不应该在这里直接使用HTML,而是使用$(‘sub-category-select).append(…),但是我得到了这样的工作,并且我打算稍后更改它.

这是我程序的这一部分所涉及的所有代码.

有人可以帮帮我吗?

解决方法

解决了这个问题,并使基于AJAX的元素保持状态.这是我的jQuery代码
$('#before_category_select').loadPage();

jQuery.fn.loadPage = function(){
if($("#new-post-area").length > 0){
    $.getJSON('/home/cat_select_state.json',function(data){
        $.get('/posts/update_sub_cat/' + data.cat_state,function(data1){
           $("#sub-category-select").html(data1);
        })
    });
   }
}

调用的控制器操作获取select元素的状态,在页面提交时存储为会话变量:

def cat_select_state
    @cat_session = {:cat_state => session[:new_post_category],:sub_cat_state => session[:new_post_sub_category]}
    respond_to do |format|
      format.json {render :json => @cat_session}
    end
  end

最后,我使用了选择框的认值,这些认值存储为会话变量.如果会话变量为null,则认值为选择框的提示消息.

<%= collection_select :post_category,options = {:prompt => "Select a category",:selected => session[:new_post_category]} %>

子类别选择元素的HTML在javascript文件update_sub_cat.js.erb中呈现.

sub-category <%= collection_select :post_sub_category,options = {:prompt => "Select a sub-category"} %>

如果您有任何进一步的改进,请建议.

原文地址:https://www.jb51.cc/ruby/271274.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐