我们想使用我们的内容可编辑,利用生成的路由在router.ex中使用以下内容:
pipeline :browser do plug :accepts,["html"] plug :fetch_session plug :fetch_flash plug :put_secure_browser_headers end pipeline :api do plug :accepts,["json"] end scope "/",TextEditor do pipe_through :browser # Use the default browser stack get "/",PageController,:index resources "/posts",PostController end
和控制器的功能,即创建:
def create(conn,%{"post" => post_params}) do changeset = Post.changeset(%Post{},post_params) case Repo.insert(changeset) do {:ok,_post} -> conn |> put_flash(:info,"Post created successfully.") |> redirect(to: post_path(conn,:index)) {:error,changeset} -> render(conn,"new.html",changeset: changeset) end end
然而,我们不想使用生成的表单,我们然后尝试使用div和jquery方法$.post来测试它:
<div id="newPost" contenteditable="true">write here</div> <div id="button" class="btn btn-primary">Save</div> <script type="text/javascript"> $(document).ready(function(){ $("#button").click(function() { var post = $("#newPost").html(); $.post( "/posts/post",{ title: post }) .done(function() { alert( "Data Loaded: " ); }); }); }); </script>
但是,我们没有收到警报或数据插入到我们的数据库中.
我们缺少什么?
解决方法
尝试以下:
$.post( "/posts",{ post: { title: post } })
您的控制器希望将参数嵌套在帖子的键下
def create(conn,%{"post" => post_params}) do
我不建议这样做,但您可以将控制器更改为:
def create(conn,%{} = post_params) do
寻找没有根帖子的参数.但是具有邮政密钥意味着您可以轻松地添加与该表单无关的附加参数.
我也不建议停用CSRF检查.您可以使用CSRF令牌轻松地将其存储在元标记中:
<Meta name="csrf" content="<%= Plug.CSRFProtection.get_csrf_token() %>">
var csrf = document.querySelector("Meta[name=csrf]").content; $.ajax({ url: "/posts",type: "post",data: { post: { title: post } }) },headers: { "X-CSRF-TOKEN": csrf },dataType: "json",success: function (data) { console.log(data); } });