当我重定向到显示表单页面的帖子中时,JQuery mobile会显示结果而不是表单。
可以说我有三种资源:
/ => Just shows a link to the /redirect_to resource, this is to test
/redirect_to => GET: Shows a form to say your name in /thank_you
/redirect_to => POST: Just redirects to /thank_you showing the name that you input
/thank_you => GET: Shows a text "Thank you name!"
等我到了谢谢!页面,如果我尝试返回家中,然后转到
/redirect_to
,则获取
/thank_you
的内容,而不是
/redirect_to
的形式,如果刷新页面,则获取该表格。
因此,我没有查看
redirect_to
的表单,而是看到
thank_you
页面。
这是 Sinatra 中的代码(如果您不了解的话),这时,我将用Flask,Snap,Rails,Django(我的应用程序在Django上)重新编写它...但它应该足够好读书。这是Github上的代码(由于StackOverflow无法检测到我的 ruby ): https://gist.github.com/1061639
要运行该应用程序,您基本上要安装sinatra:
gem install sinatra
并运行它:
./jquerymobile_redirect_error.rb
#!/usr/bin/env ruby
require 'rubygems'
require 'sinatra'
get '/' do
<<-end_page
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header" data-position="fixed">
<h1>JQuery Error</h1>
<a href="/" data-icon="home">Home</a>
<a href="/" data-icon="delete">Logout</a>
</div><!-- /header -->
<div data-role="content">
<h1>Go to /redirect_to <a href="/redirect_to">here</a>.
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<h1>Footer</h1>
</div><!-- /footer -->
</div><!-- /page -->
</body>
</html>
end_page
end
get '/redirect_to' do
<<-end_page
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header" data-position="fixed">
<h1>JQuery Error</h1>
<a href="/" data-icon="home">Home</a>
<a href="/" data-icon="delete">Logout</a>
</div><!-- /header -->
<div data-role="content">
<form action="/redirect_to" method="post" accept-charset="utf-8">
<p><label for="name">Name</label><input type="text" id="name" name="name" value="" id="name" placeholder="input your name">
<p><input type="submit" value="Redirect to /thank_you →"></p>
</form>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<h1>Footer</h1>
</div><!-- /footer -->
</div><!-- /page -->
</body>
</html>
end_page
end
post '/redirect_to' do
redirect "/thank_you/#{params[:name]}"
end
get '/thank_you/:name' do |name|
<<-end_page
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header" data-position="fixed">
<h1>JQuery Error</h1>
<a href="/" data-icon="home">Home</a>
<a href="/" data-icon="delete">Logout</a>
</div><!-- /header -->
<div data-role="content">
<h1>Thanks #{name}!</h1>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<h1>Footer</h1>
</div><!-- /footer -->
</div><!-- /page -->
</body>
</html>
end_page
end
请您参考如下方法:
为您的thank_you页面指定data-url
。这迫使表单提交中的URL更改。
<div data-role="page" data-url="/thank_you">
我从 Redirects and linking to directories下的文档中找到了该信息。
This also allows you to return urls that change as the result of a redirect, for example, you might post a form to "/login.html" but return a page from the url "/account" after a successful submission.