Já pensou em usar o RecordSet em JavaScript? Acontece que os dados operacionais do cliente podem ser tão simples. Defina uma fonte de dados, vincule os dados a várias tags e alcance os efeitos do tipo aplicação. É tão legal! (Primeiro de tudo, o conteúdo do artigo vem do MSDN, mas é apenas um resumo em minhas próprias palavras.)
Vamos dar uma olhada em dois exemplos:
http://msdn.microsoft.com/workshop/samples/author/databind/dbevts.htm
http://msdn.microsoft.com/workshop/samples/author/databind/dbupdate.htm
Eu tenho que admirar a Microsoft novamente.
Esta é a arquitetura do banco de dados:
Obviamente, existem as seguintes etapas para implementar a ligação de dados:
O primeiro passo é definir a fonte de dados
Desde o IE4.0, as quatro fontes de dados a seguir foram suportadas:
Controle de dados tabulares (TDC)
O TDC fornece uma maneira simples de acessar dados de texto com formato, geralmente um arquivo CSV.
Aqui está um exemplo simples:
<Object ClassID = CLSID: 333C7BC4-460F-11D0-BC04-0080C7055A83
id = dsocomposer largura = 0 altura = 0>
<nome do param = DATAURL Value = composer.csv>
</ject>
Serviço de dados remotos (RDS)
Serviço de dados remotos, acessando diretamente os dados no lado do servidor remoto, Internet Explorer 4.0. O RDS é implementado por meio de conectividade OLE-DB ou Open Database (ODBC).
Exemplo:
<Object ClassID = CLSID: BD96C556-65A3-11D0-983A-00C04FC29E33
id = dsocomposer altura = 0 largura = 0>
<nome do param = valor do servidor = http: // musicServer>
<nome do param = Connect Value = dsn = music; uid = convidado; pwd =>
<nome do param = SQL Value = Selecione COMPSR_NAME FROM COMPOSER>
</ject>
Mas parece um problema de segurança, porque o cliente pode ver esse código.
Fonte de dados XML
Não vou dizer muito sobre XML, eu o uso assim no IE4.0:
<applet
código = com.ms.xml.dso.xmldso.class
id = xmldso
largura = 0
altura = 0
mayscript = true>
<nome do param = URL Value = composer.xml>
</applet>
Internet Explorer 5 ou acima pode ser assim:
<!-[se gte ie 5]>
<xml id = xml1>
<ople-info>
<Page-Type> Referência </age-type>
<Member-Type> Propriedade </tember-Type>
<Mame persistente> AccessKey </s persistent-name>
<nome do tempo de execução legível = 1 WritEable = 1> AccessKey </name-name>
<suted> Define ou recupera a chave do acelerador para o objeto. </straction>
</tópico-info>
</xml>
<! [endif]->
Além disso, o IE também fornece o conceito de uma ilha de dados XML: ilhas de dados XML.
fonte de dados mshtml
Exemplo da página de dados HTML:
<H1 ID = COMPSR_FIRST> HECTOR </H1>
<marquee ID = CompSR_LAST> BERLIOZ </SHARQUEE>
<div ID = COMPSR_BIRTH> 1803 </div>
<H2 ID = COMPSR_FIRST> MODEST </H2>
<H3 ID = COMPSR_LAST> Moussorgsky </h3>
<Button ID = COMPSR_BIRTH> 1839 </botão>
<textarea id = compsr_first> Franz </sexttarea>
<XMP ID = COMPSR_LAST> LISZT </XMP>
<span iD = CompSR_Birth> 1811 </span>
Uma vez definido, você pode acessá -lo assim:
<objeto id = htmlcomposer data = compdata.htm altura = 0 largura = 0>
</ject>
.Stap 2: vincule os dados ao elemento HTML
Geralmente, ele está ligado através do DATASRC e DataFLD em tags. Por exemplo:
<Tipo de entrada = TextBox DataSrc =#DSocompomeses Datafld = COMPSR_LAST>
e
<tabela DataSrc =#dsocomposer>
<tr>
<td> <div datafld = comsr_first> </div> </td>
</tr>
</tabela>
Este é um exemplo de tabelas de ligação:
http://msdn.microsoft.com/workshop/samples/author/databind/dbtable.htm
Entre eles, a fonte de dados:
<Object ID = TDCCOMPOSSERSID = CLSID: 333C7BC4-460F-11D0-BC04-0080C7055A83>
<nome do param = DATAURL VALUE = http: //msdn.microsoft.com/workshop/samples/author/databind/composer.csv>
<nome do param = useHeader Value = true>
<nome do param = textqualifier value = '>
</ject>
Tabela Binkin
<tabela DataSrc =#tdccomposers>
<Tead> <strey = font-weight: BOLD>
<Td> Primeiro </td> <td> Último </td> <td> nascimento </td> <td> Death </td> <td> origem </td>
</tr> </head>
<Tbody>
<tr>
<td> <div datafld = comsr_first> </div> </td>
<td> <div datafld = comsr_last> </div> </td>
<td> <div datafld = comsr_birth> </div> </td>
<td> <div datafld = comsr_death> </div> </td>
<td> <div datafld = origem> </div> </td>
</tr>
</tbody>
</tabela>
Este é o efeito:
Origem da morte do último último aniversário
Hector Berlioz 1803 1869 França
Modest Moussorgsky 1839 1881 Rússia
Franz Liszt 1811 1886 França
Antonio Vivaldi 1678 1741 Itália
Johann Sebastian Bach 1685 1750 Alemanha
Ludwig Van Beethoven 1770 1827 Alemanha
Wolfgang Amadeus Mozart 1756 1791 Áustria
Joseph Haydn 1732 1809 Alemanha
Claude Debussy 1862 1918 França
Etapa 3: Adição dinâmica, exclusão, etc. de dados (modelo de objeto)
Claro que a ligação pode ser dinâmica:
No script:
span1.datasrc = #dsocomposer;
span1.datafld = comsr_first;
O HTML se parece com o seguinte:
<span dataSrc =#dsocomposer datafld = COMPSR_FIRST> </span>
E você pode acessar a fonte de dados ADO:
var orcordset = dsocomposer.RecordSet;
Naturalmente, existem Orcordset .movenext e assim por diante.
como:
<ID de entrada = cmdnavfirst Type = Button Value = <<
OnClick = tdccomposes.recordset.movefirst ()>
<ID de entrada = cmdnavprev tipo = Valor do botão = <
OnClick = tdccomposes.recordset.moveprevious ();
if (tdccomposers.recordset.bof)
tdccomposers.recordset.movefirst ();>
<ID de entrada = cmdnavNext tipo = Valor do botão =>
OnClick = tdccomposes.recordset.movenext ();
if (tdccomposers.recordset.eof)
tdccomposers.recordset.movelast ();>
<ID de entrada = cmdnavlast Type = Button Value = >>
OnClick = tdccomposes.recordset.movelast ()>
Também pode ser usado assim:
<idioma de script = vBScript>
Para cada objfld em rsattendees.fields
document.write (o nome do campo é & objfld.name & <br>)
document.write (o valor do campo é & objfld.value & <br>)
próximo
</script>
Os registros de adição e exclusão são: orcordset.addnew () e orcordset.delete ().
Etapa 3: Responda a vários eventos de dados (modelo de evento)
Como fazer processamento correspondente após alterações de dados?
O método fornecido no MSDN é o seguinte:
<script para = cbosort (nome da fonte de dados) evento = onchange (nome do evento)>
...
</script>
Estes são a lista de nomes de eventos:
Aplicativos canceláveis de bolhas de eventos para introdução na versão do Internet Explorer
OnBeForeUpdate True True Bound Elements 4.0
OnAfterUpdate True False Bound Elements 4.0
ONROWENTER TRUE FALSO DSO 4.0
OnRowExit True True DSO 4.0
OnBeForeUnload False False Window 4.0
OndataAvailable True False DSO 4.0
ONDatasetComplete verdadeiro DSO 4.0
OndataSethethed True False DSO 4.0
OnErrorUpdate True True Limited Elements 4.0
ONREADESTATATECHANGE TRUE FALSO DSO 4.0
ONCellChange True False DSO 5.0
OnRowsInserted True False DSO 5.0
OnRowsDelete True False DSO 5.0
Que tal?
Eu acho que http://msdn.microsoft.com/workshop/samples/author/databind/dbevts.htm é um exemplo relativamente abrangente de aplicativo. Se você estudá -lo com cuidado, você ganhará alguma coisa.
Existem muitos exemplos de uso de ligação de dados para implementar a paginação na Internet. De fato, a ligação de dados pode fazer mais coisas, certo? Deve haver aplicativos muito grandes no cliente rico, como fazer datagrids muito complexos.
O que eu quero entender melhor agora é como alcançar facilmente a sincronização com o lado do servidor, porque a ligação de dados do cliente não tem impacto no lado do servidor (você pode gerar fontes de dados do lado do servidor, mas a operação do cliente não retornará automaticamente ao servidor). O MSDN disse que o RDS está ok, mas esse método é muito desajeitado e inseguro.