分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

rails中发送ajax请求

发布时间:2023-09-06 02:12责任编辑:沈小雨关键词:暂无标签

最近在写一个blog系统练练手,遇到一个一个问题,用户添加评论的时候想发送ajax请求,但是rails里的ajax和Python中的不太一样,Python中的ajax是用js,jquery实现的和rails不太一样,在此记录一下,研究了好久终于弄明白了一点

告诉框架我们要发送ajax请求

rails这个框架吧,ajax与后端结合的非常紧密。

当我们想发送一个ajax请求的时候,在模板生成的时候我们可以添加一个属性

form表单, <%= form_for (Comment.new), url: post_comments_path(@post),remote:true do |f| %> 当我加上remote:true时那么就会发送ajax请求了。

a标签 也是一样  <%= link_to ‘ajax-request‘, ‘/xxxx/create‘, remote: true%> 这样也就可以发送ajax请求了。

为什么我们这么一设置就可以发送ajax请求了呢。因为rails内部使用了?

Rails 使用一种叫做 Unobtrusive JavaScript(UJS) 的方式来挂载内建的 JavaScript 功能,也就是你在 app/assets/javascripts/application.js 里面加载的 //= require jquery_ujs,这些功能包括

  • 让超连结可以用 :method 参数支援非 GET 方法
  • 用超连结、按钮和表单可以用 :remote => true 支援 Ajax
  • 超连结、按钮和表单可以用 "data-confirm" 参数可以跳确认对话视窗
  • 送出按钮可以用 data-disable-with 参数在送出表单时暂时关闭按钮避免重复送出

这里我也遇到了一个问题当我直接发送的时候,服务器告诉我没有csrf token验证

这里我们需要在模板中加上 <%= csrf_meta_tags %> 这样就不会出错了

Ajax请求的过程

1.当我们点击发送ajax请求的时候,会到相应的控制器中。比如我这里到了cmment控制器中。

comments_conttroller.rbclass CommentsController < ApplicationController ?def create ???pp params ???@post = Post.where(id: params[:post_id]).first ???@comment = Comment.new(user_id: current_user.id, post_id: params[:post_id], content: params[:comment][:content]) ???respond_to do |format| ?????if @comment.save ???????format.html ?????????# 里面是要生成的html代码,就是我在页面上要添加的 ????????format.js ?????????????#执行的js代码 文件名和方法名一致,例如我这个是create.js.erb ???????format.json {render json: @comment} ?????end ???end ?end ?private ???def comment_params ?????params.require(:comment).permit(:content) ???endend

respond_to do |format| "https://api.rubyonrails.org/classes/ActionController/MimeResponds.html"可以到该网站去查看用法

主要就是看返回什么我们这里是ajax请求那么返回的就是format.js

2. 到了相应的create.js.erb中

$("#comment_content").append("<%= escape_javascript(render ‘create‘) %>")
<%= escape_javascript(render ‘create‘) %>  

 这里回去找相对应的模板 我这里render ‘create‘ 那么他就回去找(因为我这里是comments下,回在comments目录下找)_create.html.erb。

这样就可以发送ajax请求了

rails中发送ajax请求

原文地址:https://www.cnblogs.com/Stay-J/p/9543527.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved