Question

我正在按照教程http://fuelyourcoding.com/getting-started-with-jquery-mobile-rails-3/将简单的脚手架Rails 3应用程序中的视图转换为jquery移动前端。

创建新记录后，我已经转到show视图，实际上会看到show视图的结果，就像在记录的两个新创建的字段中一样，但是，URL是{{3}在浏览器中。当我查看源代码时，源实际上是索引视图而不是在浏览器中呈现的show视图，这是相当奇怪的。任何想法为什么会发生这种情况？

的Gemfile：

source 'http://rubygems.org'

gem 'rails', '3.0.10'

# Bundle edge Rails instead:
# gem 'rails', :git => 'git://github.com/rails/rails.git'

gem 'sqlite3'
gem 'jquery-rails'

路线：

Mycurrency::Application.routes.draw do
  resources :currencies

  #match ':name' => 'Currencies#show', :as => 'currency_name'

  root :to => 'currencies#index'

控制器：

class CurrenciesController < ApplicationController
  # GET /currencies
  # GET /currencies.xml
  def index
    @currencies = Currency.all

    respond_to do |format|
      format.html # index.html.erb
      format.xml  { render :xml => @currencies }
    end
  end

  # GET /currencies/1
  # GET /currencies/1.xml
  def show
   # @currency = Currency.find(params[:id])

    if params[:name]
      if Currency.where(:name => params[:name]).first != nil
        @currency = Currency.where(:name => params[:name]).first
      else
        redirect_to root_path
      end    
    else
      @currency = Currency.find(params[:id])
    end

   # respond_to do |format|
    #  format.html # show.html.erb
     # format.xml  { render :xml => @currency }
  #  end
  end

  # GET /currencies/new
  # GET /currencies/new.xml
  def new
    @currency = Currency.new

    respond_to do |format|
      format.html # new.html.erb
      format.xml  { render :xml => @currency }
    end
  end

  # GET /currencies/1/edit
  def edit
    @currency = Currency.find(params[:id])
  end

  # POST /currencies
  # POST /currencies.xml
  def create
    @currency = Currency.new(params[:currency])

    respond_to do |format|
      if @currency.save
        format.html { redirect_to(@currency, :notice => 'Currency was successfully created.') }
        format.xml  { render :xml => @currency, :status => :created, :location => @currency }
      else
        format.html { render :action => "new" }
        format.xml  { render :xml => @currency.errors, :status => :unprocessable_entity }
      end
    end
  end

  # PUT /currencies/1
  # PUT /currencies/1.xml
  def update
    @currency = Currency.find(params[:id])

    respond_to do |format|
      if @currency.update_attributes(params[:currency])
        format.html { redirect_to(@currency, :notice => 'Currency was successfully updated.') }
        format.xml  { head :ok }
      else
        format.html { render :action => "edit" }
        format.xml  { render :xml => @currency.errors, :status => :unprocessable_entity }
      end
    end
  end

  # DELETE /currencies/1
  # DELETE /currencies/1.xml
  def destroy
    @currency = Currency.find(params[:id])
    @currency.destroy

    respond_to do |format|
      format.html { redirect_to(currencies_url) }
      format.xml  { head :ok }
    end
  end
end

application.html.erb：

<!DOCTYPE html>
<html>
<head>
  <title>Mycurrency</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
  <%= javascript_include_tag :defaults %>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
  <%= csrf_meta_tag %>
</head>
<body>
<div data-role="page">
    <%= yield %>
</div>

</body>
</html>

Answer 1

jQuery Mobile通过AJAX加载页面，将它们添加到DOM中，然后使用所有jQuery Mobile样式增强它们。由于这种通过AJAX加载页面的方法，当用户在网站上导航时，页面的来源不会改变。

要查看当前页面的源代码，您需要刷新网页。

我建议阅读用于AJAX导航的jQuery Mobile Documentation：http://jquerymobile.com/demos/1.0rc2/docs/pages/page-navmodel.html

Answer 2

将此添加到您的布局中。它强制浏览器缓存更新URL。

<div data-role="page" id="home" data-url="<%= request.path %>">

Rails jquery移动路由/渲染问题

2 个答案: