เปลี่ยนเส้นทาง_เป็นไม่ทำงานกับอาแจ็กซ์

ฉันได้สร้างแบบฟอร์ม ajax ใน modal bootstrap ซึ่งสร้างโพสต์ใหม่ลงในฐานข้อมูลของฉัน แบบฟอร์มคือ:

<%= form_for @post, remote:true, :html => {:id => "share-needs-form"} do |f| %>
    <div class="modal-body">
        <div id="shareNeedsModalFirstStep">
        <div class="row" style="margin-bottom: 10px">
            <ul class="error-alert hidden share-needs-form-errors col-lg-10 col-centered" id="share-needs-error-alerts"></ul>
    </div>
    <div class="row"style="margin-bottom: 10px;">
        <div class="col-lg-10 col-centered">
            <%= f.text_field(:title, :class => "form-control", :placeholder => "Add a title for e.g I need a designer, in return I can code for you", :id => "title") %>
        </div>
    </div>
    <div class="row" style="margin-bottom: 10px;">
        <div class="col-lg-10 col-centered">
            <%= f.text_area(:description, :rows => "5", :class => "form-control", :id => "description", :placeholder => "Write some description about your idea, so that people who can offer an exchange know what you want to accomplish") %>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-10 col-centered">
            <%= f.text_field(:keywords, :class => "form-control", :id => "keywords", :placeholder => "Add some keywords (not more than 5 and comma(,) separated)") %>
        </div>
    </div>
    </div>
    <div class="row hidden" id="shareNeedsModalSecondStep" >
        <div class="well" style="max-height: 250px; overflow-y: scroll;">
            <div>
            <a href="/th#" style="font-size: 17px;">I need a designer, in return I can code for you</a>
            <p>I need a designer for a game project, I am working on a small 2D game, I can provide my coding skills for you. I am good at making web applications, and...</p>
            </div>
            <hr />
            <a href="/th#" style="font-size: 17px;">I need a designer, in return I can code for you</a>
            <p>I need a designer for a game project, I am working on a small 2D game, I can provide my coding skills for you. I am good at making web applications, and...</p>
            <hr />
            <a href="/th#" style="font-size: 17px;">I need a designer, in return I can code for you</a>
            <p>I need a designer for a game project, I am working on a small 2D game, I can provide my coding skills for you. I am good at making web applications, and...</p>
        </div>
    </div>
    </div>
    <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-warning hidden" id="shareNeedsModalBackButton">Back</button>
    <button type="button" class="btn btn-warning" id="shareNeedsModalContinueButton">Continue</button>
    <%= submit_tag "Share", :class => "btn hidden btn-warning", :id => "shareNeedsModalFormSubmitButton" %>
    </div>
<% end %>

และนี่คือคอนโทรลเลอร์ที่เกี่ยวข้อง:

def create
    @post = Post.new(post_params)
    if @post.save
        redirect_to post_path(@post.id)
    else
        @errors = @post.errors.full_messages
        render :json => @errors.to_json
    end
end

อย่างที่คุณเห็น วิธีการสร้างจะสร้างโพสต์ใหม่ตามฟิลด์แบบฟอร์มที่ได้รับจาก post_params บล็อก else ทำงานได้ดีซึ่งหมายความว่าข้อผิดพลาดจะถูกส่งกลับและแสดงในมุมมองของฉันโดยใช้จาวาสคริปต์ต่อไปนี้:

$("#share-needs-form").bind("ajax:complete", function(evt, data, status, xhr) {
    console.log(data.responseText);
    if(typeof data == "object") { //errors were returned as a json "object"
        $("#shareNeedsModalBackButton").click();
        var form_errors_holder = $("#share-needs-error-alerts");
        form_errors_holder.removeClass("hidden");
        form_errors_holder.html("");
        var errors = data;
        for(var i = 0; i < errors.length; i++) {
            form_errors_holder.append("<li>" + errors[i] + "</li>");
        }
    }
});

แต่ในตัวควบคุมเมื่อบันทึกโพสต์สำเร็จ โพสต์จะไม่เปลี่ยนเส้นทางไปยัง post_path ของฉัน แต่จะส่งคืน html ทั้งหมดของหน้า post_path ของฉัน เหตุใดการเปลี่ยนเส้นทางจึงไม่ทำงาน และฉันจะแก้ไขได้อย่างไร กรุณาช่วย.


person Mohammad Areeb Siddiqui    schedule 04.06.2015    source แหล่งที่มา


คำตอบ (1)


จริงๆ แล้วคุณกำลังส่งคำขอ js ดังนั้นเซิร์ฟเวอร์จึงส่งการตอบกลับถึงคุณในรูปแบบ js โดยคุณจะต้องเขียนรูปแบบการตอบกลับในเมธอด create ดังต่อไปนี้

def create
  @post = Post.new(post_params)
  respond_to do |format|
    if @post.save
      format.html { redirect_to @post }
      format.js
    else
      format.html { render :new }
      format.js
    end
  end
end

และสร้างไฟล์ app/views/posts/create.js.erb และเขียนโค้ดต่อไปนี้

<% if @post.errors.empty? %>
   window.location = "<%= post_path(@post) %>";
<% end %>
person Sarwan Kumar    schedule 04.06.2015
comment
แล้วไฟล์จาวาสคริปต์ของฉันล่ะ? posts.js? ฉันควรปล่อยมันไว้เหมือนเดิมไหม? - person Mohammad Areeb Siddiqui; 04.06.2015
comment
เมื่อคุณใช้แบบฟอร์มระยะไกล มันจะส่งคำขอ ajax โดยอัตโนมัติ ดังนั้นคุณไม่จำเป็นต้องมีจาวาสคริปต์เพิ่มเติม เพียงเขียนจาวาสคริปต์ใน create.js.erb เพื่อตอบสนอง - person Sarwan Kumar; 04.06.2015
comment
นอกจากนี้ ฉันได้รับข้อผิดพลาดนี้ใน create.js.erb: วิธีการที่ไม่ได้กำหนด `ข้อผิดพลาด' สำหรับ nil:NilClass บนบรรทัด - person Mohammad Areeb Siddiqui; 04.06.2015
comment
มันไม่สามารถเข้าถึงได้ ฉันควรทำอย่างไรดี? - person Mohammad Areeb Siddiqui; 04.06.2015
comment
ไม่ล่ะขอบคุณ. เปลี่ยนกลับเป็นคำตอบเดิมที่ใช้งานได้ แล้วฉันจะยอมรับมัน :) ขอบคุณ. :) - person Mohammad Areeb Siddiqui; 04.06.2015