Sono abbastanza nuovo al concetto di sviluppo lato client javascript. Mi sto imbattendo in un problema, anche se potrebbe essere che non capisco come realizzare qualcosa con il mash di framework.Sammy.js e Knockout.js => Templatura senza modelli?
So che voglio usare Knockout per le sue chicche lato cliente ricco. Voglio anche utilizzare Sammy.js per consentire il routing e il trasferimento dei dati alle visualizzazioni a eliminazione diretta (provengo da uno sfondo MVC in cui riempio un modello con i dati, quindi restituisco la vista (modello) e MVC lo lega bene e fa per me) .
Così ora io sto cercando di fare qualcosa di simile lato client ...
Ecco il mio Index.HTML:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<title>The EClassifieds Mobile</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<!-- <script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>-->
<script type="text/javascript" charset="utf-8" src="./scripts/cordova-1.8.1.js"></script>
<script type="text/javascript" charset="utf-8" src="./scripts/knockout.js"></script>
<script type="text/javascript" charset="utf-8" src="./scripts/templ.js"></script>
<script type="text/javascript" charset="utf-8" src="./scripts/sammy.js"></script>
<script type="text/javascript" charset="utf-8" src="./scripts/sammy.tmpl.js"></script>
<script type="text/javascript" charset="utf-8" src="./services/RouteManager.js"></script>
<script type="text/javascript" charset="utf-8" src="./services/ApplicationManager.js"></script>
<link rel="stylesheet" href="./style/site.css" type="text/css" media="screen" title="no title" charset="utf-8"/>
<!-- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />-->
</head>
<body>
<div id="main">
<h1>HELLO WORLD!</h1>
<!--Sammy should update the content of this div dynamically, creating a SPA (single page application)-->
</div>
</body>
</html>
Qui è la mia configurazione Sammy.
(function ($) {
alert('Building Routes');
var app = $.sammy('#main', function() {
this.use('Tmpl', 'html');
this.get('#/', function (context) {
alert('Rendering Partial for Login page');
context.app.swap('Loading...');
this.render("/views/Login.html");
});
});
$(function() {
app.run('#/');
});
})(jQuery);
Ecco il mio login.html
<!--Model File Goes Here -->
<script type="text/javascript" charset="utf-8" src="../models/Login.js"></script>
<fieldset title="Please Login to Begin :">
<div data-role="content" style="padding: 15px">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup" data-mini="true">
<label for="txtUsername">
Username
</label>
<input id="txtUsername" data-bind="value: username" placeholder="Stevie" value="" type="text" />
</fieldset>
</div>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup" data-mini="true">
<label for="txtPassword">
Password
</label>
<input id="txtPassword" data-bind="value: password" placeholder="yep!" value="" type="password" />
</fieldset>
</div>
<a id="btnLogin" data-role="button" data-transition="fade" href="#page1" >
Login
</a>
</div>
<div id="errorText">
<h1></h1>
</div>
<p id="deviceProperties">Loading device properties...</p>
</fieldset>
<script type="text/javascript">
$(document).ready(function() {
ko.applyBindings(new LoginDataModel(0, "Stevie", "theTV", true));
});
</script>
ho anche bisogno di qualche modo per passare i dati dal sammy ottenere gestore, alla pagina eliminazione diretta. C'è un modo per farlo, o sto tentando l'impossibile?
UPDATE 1: Mi piacerebbe molto essere in grado di fare qualcosa di simile:
var app = $.sammy('#main', function() {
this.use('Tmpl', 'html');
this.get('#/', function (context) {
alert('Rendering Partial for Login page');
context.app.swap('Loading...');
var data = getLoginData();
this.render("/views/Login.html", data);
});
Sammy fa la stessa identica cosa con altri framework di modello, tuttavia, non vedo come mi legherebbe i dati $ nella vista Knockout ai dati trasmessi da Sammy.
Il collegamento del punto di partenza ora passa a un sito di malware. Secondo l'articolo SO http://stackoverflow.com/help/how-to-answer "I collegamenti alle risorse esterne sono incoraggiati, ma per favore aggiungi un contesto intorno al link in modo che i tuoi colleghi abbiano un'idea di cosa sia e perché è lì Cita sempre la parte più rilevante di un link importante, nel caso in cui il sito target sia irraggiungibile o sia permanentemente offline. " – AndyJ
Andy J grazie per l'identificazione, il link originale è andato giù – Ananda