Oyun 2.ortak bir düğme ile bir AJAX isteği yapmak için Nasıl x:
Başarıyla önce çalışmak için ajax isteklerini aldık ama her zaman bir form kullanmak zorunda kaldım, ve sonunda teslim etmesi sayfayı yenileyin böylece return false yapın.
Ayrıca son zamanlarda bu @ komutlar benim başarısız olmasına neden oldu ayrı bir dosya içine benim javascript taşındım. Bu benim yolum benim url ayarlamak için ne kadar?
Html:
<button id="saveAsDefaultButton">Save as default</button>
Java kod Playframework:
public static Result saveDefaultPhoneForUser(String handset) {
User currentUser = User.findByName(session("name"));
currentUser.lastControlledHandset = theHandset;
currentUser.save();
return ok();
}
güzergah:
POST / controllers.Application.saveDefaultPhoneForUser(handset : String)
javascript:
$('#saveAsDefaultButton').click(function(evt) {
$('#errors').hide();
$.ajax({
type : 'POST',
url : "controllers.Application.saveDefaultPhoneForUser",
data : $('#controlledPhone option:selected').text(),
dataType : "text",
success : function(data) {
//setError('Call succedded');
//$('#test1').attr("src", data)
},
error : function(data) {
setError('Make call failed');
}
});
return false;
});
Eminim bunu yapmak için bir yol var sadece bir şans bir şey bulmakta zorlanıyorum. Herhangi bir yardım büyük appreaciated.
CEVAP
Bu iş için yollar rotaya göre doğru JS oluşturur javascriptRoutes
ile gitmeli.conf. sample Zentask kullanım örnek bulabilirsiniz
Neyse, şimdilik url
değiştirerek AJAX arama çözebilirsiniz
url : '@routes.Application.saveDefaultPhoneForUser()',
Bu şekilde yanlış olan bir şablon, tüm JS koymak gerekir. Olabilir hatta JS dosyası ayrı ve javascriptRoutes kullanmak gerekir bunu mümkün kılmak için taşınmalıdır.
Daha fazla...
javascriptRoutesdeğildir nitelendirdihenüzresmi belgelerde, ama burada adım adım giriş. Açıklama sofistike görünüyorde factobu yolu kullanarak getirdiği pek çok yarar.
1. Ortak yollar oluşturmak
İlk conf/routes
dosya ortak yollar oluşturmanız gerekir:
GET /item/:id controllers.Application.getItem(id: Long)
POST /item/new controllers.Application.newItem
PUT /item/:id controllers.Application.updateItem(id: Long)
Tabii ki, Application
kumanda en az bu üç eylem oluşturmanız gerekir:
getItem(Long id){ ... }
newItem() { ... }
updateItem(Long id) { ... }
2. Bir eylem ortak yollar tercüme JS oluşturun
- bir yerde, yani yer.
Application
denetleyicisi - Hadi
javascriptRoutes()
Ara
Bu eylem noktası olacakmevcutconf/routes
dosya yolları
public static Result javascriptRoutes() {
response().setContentType("text/javascript");
return ok(
Routes.javascriptRouter("myJsRoutes",
routes.javascript.Application.getItem(),
routes.javascript.Application.newItem(),
routes.javascript.Application.updateItem(),
//inside somepackage
controllers.somepackage.routes.javascript.Application.updateItem()
)
);
}
Not:Parantez içinde herhangi bir parametreler kümesi yok.
3. javascriptRoutes
eylem için bir rota oluşturun ve şablonu vardır
Route 32**
GET /javascriptRoutes controllers.Application.javascriptRoutes
/views/main.scala.html
<head>
parçası görünümünde
<script type="text/javascript" src='@routes.Application.javascriptRoutes()'></script>
4. İstediğiniz javascriptRoutes kullanın
Şu anki JS yolları url
type
belirtmek için gerek kalmadan doğru yol almak için kullanabilirsiniz. Örnek: yerine
$('.getAjaxForThisContainer').click(function(e) {
var idToGet = $("#someField").val();
$.ajax({
type : 'GET',
url : '@routes.Application.getItem()',
data : {
id: idToGet
},
success : function(data) {
// ... some code on success
}
});
return false;
});
basitleştirilmiş sürüm (myJsRoutes
nokta 2) kullanabilirsiniz
myJsRoutes.controllers.Application.getItem(idToGet).ajax({
success : function(data) { ... some code ... }
});
ya
myJsRoutes.controllers.Application.newItem().ajax({
success : function(data) { ... some code ... }
});
vb...
type: "POST"
- JS yönlendiriciconf/routes
kurala göre doğru yöntemi kullanır belirtmenize gerek yok- kayıt (veya diğer parametreler)
GET
PUT
(veya diğer yöntemler)id
saf JSroutes-like
sözdizimi kullanarak ayarlayabilirsiniz - Eğer yol kural tüm gerekli parametreler içeriyorsa gerçekten senin JS: küçültebilirsiniz
yol için:
GET /some/:a/:b/:c controllers.Application.getABC(a: String, b: Integer, c: String)
JS:
myJsRoutes.controllers.Application.getABC("a", 1, "b" ).ajax({});
Nasıl jQuery Ajax çağrısından sonra bi...
Nasıl, asenkron yerine senkron AJAX is...
Nasıl bir WordPress kullanmak yapmadan...
Nasıl js veya jQuery ile ajax isteği i...
Nasıl iptal jQuery/AJAX isteği iptal e...