美文网首页ruby on rails
使用form表单进行前后台传值

使用form表单进行前后台传值

作者: 稻草人_b788 | 来源:发表于2018-03-19 16:51 被阅读14次

form表单的写法

一、使用原生的form表单

例如通过提交表单进行更新操作,原生表单的写法如下:
方法1:

<% form action="/users"  method=" POST" %>
<input type="hidden", name="_method",value="PUT">
姓名:<input name="name" >
年龄:<input name = "age" >
<input type="submit" value="提交" >
 <% end %> 

对应的controller中update action的传值是:

@user = User.update(name: params[:name], age: params[:age])

@user = User.update(params.permit(:name, :age)

方法2:

<% form action="/users"  method=" POST" %>
<input type="hidden", name="_method",value="PUT">
姓名:<input name="user[name]" >
年龄:<input name = "user[age]" >
<input type="submit" value="提交" >
 <% end %> 

对应的controller中update action的传值是:

@user = User.update(name: params[:user][:name], age: params[:user][:age])

@user = User.update(params.require(:user).permit(:name, :age)

方法3:

<% form @user action= "/users"  method=" POST" %>
<input type="hidden", name="_method",value="PUT">
姓名:<input name="name" >
年龄:<input name = "age" >
<input type="submit" value="提交" >
 <% end %> 

由于form中引用了@user这个实例变量,那么其中的

姓名:<input name="name" >
年龄:<input name = "age" >

等价于方法2的写法,这时候就需要透过user去取值,传到后台的params其实是hash套user的hash的格式,
对应的controller中update action的传值是:

@user = User.update(name: params[:user][:name], age: params[:user][:age])

@user = User.update(params.require(:user).permit(:name, :age)

方法4.
和方法3不同在于@user是一个实例变量,而如果用:user则是指向user这个model进行增删改查,因此还可以写成:

<% form_for :user, url: users_path, method: :put %> do |f|
<%= f.label :"姓名" %>
<%= f.text_field :name %>
<%= f.label :"年龄" %>
<%= f.text_field :age %>
<input type="submit" value="提交" >
 <% end %> 

这里我们用的是f去遍历form_for中每个字段,因此写法和上面三种原生的form表单略有不同
由于在form_for中指定了user这个model,因此我们需要透过user去取name,age的值,传到后台的params其实是hash套user的hash的格式,
对应的controller中update action的传值是:

@user = User.update(name: params[:user][:name], age: params[:user][:age])

@user = User.update(params.require(:user).permit(:name, :age)

补充:

1.params.permit(:name)这样的写法是只有一层,那么直接可以通过params[:name]来获取name的值;而params.require(:user).permit(:name)是有两层关系,需要通过params[:user][:name]才能获取name的值

2.使用f.text_field传值和input传值方式有所不同
(1)用input获取后台的值

<input name= "user_name", value="<%=@user.user_name%>" >

(2)用f.text_field获取后台的值

<%= f.text_field :user_name, class: "form-control", value:  @user.age%>

两者的区别在于value=后面跟的是字符串"<%=@user.user_name%>",可以用字符串拼接的方法;而value: 后面不跟字符串而是直接用@user.user_name获取栏位中的内容

注意:

如果不确定传到后台的params是什么格式,那么可以使用pry加入断点来看

相关文章

  • 使用form表单进行前后台传值

    form表单的写法 一、使用原生的form表单 例如通过提交表单进行更新操作,原生表单的写法如下:方法1: 对应的...

  • Express接收数据(post、get)

    1)接收前台form表单的get传值 注意前台配置form表单的action是后台配置的路由路径 2)进阶利用aj...

  • 使用form_for表单对象进行模糊查询

    实例代码 这里要在form_for中进行new,目的是初始化对象。form_for需要form表单对象才能向后台传...

  • springmvc后台往页面传值

    先说说页面往后台传值的方法,欢迎补充:一、form表单提交(常用)二、JQuery中的ajax提交(常用)三、通过...

  • _GET _POST 传值 页面跳转

    javascript 页面跳转 php 传值 对于a标签 id写在a标签的属性 对于form表单 传在form 属...

  • HTML笔记3_表单元素

    在前端开发中经常使用到表单来向服务器传值. form form标签是一个表单标签的容器,该标签的开始和结束直接定义...

  • 循环数据进行表单验证

    使用表单验证,如需进行表单某个单独元素验证,在表单el-form添加rules规则,相应的元素对应相应的prop值...

  • 表单上传的几种方法

    使用form表单进行提交 使用FormData对象 使用jquery.form.js jquery.form.js...

  • JSP --> servlet

    JSP页面有3种方法向 servlet传值: form表单、URL 、其他 1、对于该JSP页面 form表单的内...

  • 近期vue开发相关问题

    问题一: 子组件传值给父组件,当使用elementUI是,modal弹框中需要一个form表单,所以我把form表...

网友评论

    本文标题:使用form表单进行前后台传值

    本文链接:https://www.haomeiwen.com/subject/mgupqftx.html