[quasi ot] jQuery API .change()
Ciao,
Grazie all' aiuto di pablos71, che sentitamente ringrazio,
sto cercando di capire TinyWebServer, argomento ostico paragonabile, almeno per me,
a javascript e il suo framework jQuery.
La pagina html che genera un slider i cui valori vengono visualizzati in una textbox
vengono mandati all' Arduino tramite un bottone.
Fi qui tutto bene, 8) ma volendo automatizzare il processo escludendo il bottone di invio e
quindi spedire i dati onchange, banalmente si potrebbe utilizzare onchange='this.form.submit().
Però non mi pare sia la cosa + elegante!
Vorrei fare uso tra le API jQuery .change() ma non so come fare.
di seguito la pagina index.htm
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<style>
#demo-frame > div.demo { padding: 10px !important; };
</style>
<script>
$(function() {
$( "#slider-vertical" ).slider({
orientation: "vertical",
//orientation: "horizontal",
range: "min",
animate: true,
min: 0,
max: 255,
value: 0,
slide: function( event, ui ) {
$( "#testo3" ).val( ui.value );
}
});
$( "#testo3" ).val( $( "#slider-vertical" ).slider( "value" ) );
});
</script>
<script>
var msg="";
var ind= "/Istruzioni_da_web";
function elabora_dato()
{
var testo=document.form1.testo3.value;
document.form1.areatesto.value + testo + "\n";
$.ajax({type: "POST", data: testo, dataType: "text", cache: false, url: ind,
success:function(risposta)
{
document.form1.areatesto.value += risposta ;
}
});
}
$(document).ready(
function(){
msg="Connessione.....#";
invia_dati("/Istruzioni_da_web");
});
</script>
<title>prova TinyWebServer e slider 1</title>
</head>
<body>
<div class="demo">
<form name="form1">
<textarea cols="80" rows="1" id="textareaname" name="areatesto">
</textarea>
<p><input type="text" name="testo3" id="testo3" style="border:1; color:#ff0000; font-weight:bold;" />
<input type="button" value="Invia > Arduino" id="invia" onclick="elabora_dato()">
</p>
</form>
<div id="slider-vertical" style="height:200px;"></div>
</div>
</body>
</html>
Grazie
Luca