AJAX começar com a supercarga AJAX seus aplicativos da Web | Laurence Svekis | Skillshare

Velocidade de reprodução


  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

AJAX começar com a supercarga AJAX seus aplicativos da Web

teacher avatar Laurence Svekis, Best Selling Course Instructor

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

17 aulas (1 h 31 min)
    • 1. Introdução ao AJAX

      3:25
    • 2. O que cobrimos neste curso

      4:11
    • 3. o que é AJAX

      3:38
    • 4. Campo de formulário dinâmico Verificar com AJAX JavaScript

      6:31
    • 5. Como configurar a verificação de navegador XMLHttpRequest

      5:59
    • 6. Dados de formulário AJAX enviar GET POST

      6:00
    • 7. AJAX readyState

      6:09
    • 8. Revisão de resumo de formulário dinâmico AJAX

      4:47
    • 9. Dados JSON como um objeto no arquivo JSON vs JSON usando AJAX

      6:03
    • 10. AJAX pronto set go

      3:50
    • 11. Conexão de arquivo AJAX JSON

      4:05
    • 12. Dados de texto de resposta AJAX

      5:38
    • 13. Como criar o HTML interno do arquivo JSON

      11:07
    • 14. Resumo de questionário JSON AJAX

      2:03
    • 15. Introdução ao JQuery AJAX

      5:01
    • 16. Publicação de ajax JQuery com resposta de retorno de chamada

      4:38
    • 17. Sucesso de erro de resposta de retorno JQuery AJAX

      8:08
  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

142

Estudantes

--

Sobre este curso

Usando AJAX crie conteúdo da Web DINÂMICO incrível usando JSON JQuery JavaScript para nenhum carregamento de conteúdo de recarregamento de página

Saiba como criar um FORMULÁRIO WEB DINÂMICO que usa AJAX para se conectar ao código de retorno e respostas de retorno. Saiba como tornar seu conteúdo de página HTML interagir com o código BACK-END.

Saiba como tornar o JavaScript mais útil, mostramos todos os blocos de construção que você precisa para criar seus próprios aplicativos interativos JavaScript.

Arquivos de origem incluídos!!! Não há tempo desperdiçado nos direcionamos ao ponto. Muitos extras para ajudá-lo a aprender.

Neste curso, mostramos como fazer uma verificação de nome de usuário instantâneo, que usa AJAX para se conectar ao código PHP. DOM JavaScript para obter o valor de campo de formulário e, em seguida, enviar esse valor para o fim de retorno via AJAX. Resposta de retorno de chamada do servidor e, em seguida, enviá-lo em HTML usando JavaScript. Também mostramos como usar AJAX no JQuery para fazer a mesma coisa.

Mostramos como inserir dados do JSON no JavaScript e analisá-los como um objeto utilizável para criar conteúdo HTML.

Tudo o que você precisa aprender sobre como criar aplicativos web JavaScript dinâmicos é fornecido neste curso.

  • nenhum tempo desperdiçado assistindo alguém tipo
  • Aulas rápidas chegar ao ponto
  • Tópicos totalmente cobertos com exemplos do mundo real
  • Arquivos de origem baixáveis para trabalhar junto
  • desafios e lições
  • nome de confiança na educação desde 2002
  • codificação de origem completa HD fácil de ler
  • Suporte de resposta rápida aos alunos
  • Discussões regulares

Conheça seu professor

Teacher Profile Image

Laurence Svekis

Best Selling Course Instructor

Professor

Web Design and Web Development Course Author - Teaching over 1,000,000 students Globally both in person and online.    Google Developer Expert since 2020 GDE

I'm here to help you learn, achieve your dreams, come join me on this amazing adventure today
Google Developers Expert - GSuite

Providing Web development courses and digital marketing strategy courses since 2002.

Innovative technology expert with a wide range of real world experience. Providing Smart digital solutions online for both small and enterprise level businesses.

"I have a passion for anything digital technology related, enjoy programming and the challenge of developing successful digital experiences. As an experienced developer, I create... Visualizar o perfil completo

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%
Arquivo de avaliações

Em outubro de 2018, atualizamos nosso sistema de avaliações para melhorar a forma como coletamos feedback. Abaixo estão as avaliações escritas antes dessa atualização.

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui cursos curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Introdução ao AJAX: Bem-vindo ao próximo nível fora interação dinâmica em seu site usando Ajax. E se você nunca usou Ajax antes, enquanto você vai ficar realmente impressionado com o que pode ser feito com Ajax, meu nome é Lawrence e eu sou um desenvolvedor web por mais de 14 anos. Eu desenvolvo regularmente aplicações Web dinâmicas, e o Ajax é definitivamente uma das minhas ferramentas favoritas para usar para realmente interagir com o conteúdo e para criar algum conteúdo dinâmico. Então, remendar as linguagens de construtor PHP com JavaScript e ser capaz de interagir com esse conteúdo dinâmico realmente faz um jack de pé, bem como ser capaz de acessar arquivos Jason e arquivos de dados e puxar isso para o seu JavaScript é criar esse novo nível fora do conteúdo que está disponível dentro do seu arquivo JavaScript. Portanto, você não precisa mais se conectar a um arquivo de origem de script de trabalho e puxá-lo como um objeto. Você pode realmente ter alguma capacidade dinâmica para extrair conteúdo em um formato mais legível, que é Jason, e tudo isso é feito através do Ajax. E dentro deste curso, eu vou estar compartilhando meu conhecimento do Ajax com você estava construindo várias aplicações, então estes ar alguns casos de uso muito úteis para o Ajax. Um deles vai ser este formulário de dados onde podemos fazer uma verificação para ver se este nome já é tomado dentro do servidor. E se não for, seremos capazes de devolver que está disponível. Eso apenas digitando. Você provavelmente já viu esses tipos de formatos antes, e este é o Ajax que está trabalhando aqui. Uma maravilha como tirar todos esses dados do Jason. realmente Coisas realmenteincríveis que você pode fazer com o Ajax. Então nós configuramos um servidor zam para hospedar nossos arquivos PHP. Então nós temos isso correndo aqui em segundo plano. Se você não estiver familiarizado com a configuração de um host local, temos um curso adicional que fornecerá informações sobre como configurar o host local. Mas não vai ser absolutamente necessário para você praticar o Ajax e porque isso vai ser javascript e você não precisa necessariamente saber PHP para este curso, porque nós vamos estar descobrindo alguns aspecto básico e você pode realmente apenas criar um arquivo de texto com qualquer resposta que você quiser? Claro, não será dinâmico porque a habilidade dinâmica realmente fez aqui dentro do código PHP. Quando estamos nos conectando através do Ajax, mas você pode trabalhar com ele e eso você não necessariamente configurar um host local, também. Nós também forneceremos todos os links e recursos disponíveis que estamos usando ao longo deste curso dentro da seção de recursos deste curso. Então, é encorajado que você faça Confira isso e faça o download dessas informações. Se você não tem um editor de texto, temos uma lista de alguns grandes editores de texto de código aberto disponíveis on-line que você pode baixar também. Eu gostaria de dar as boas-vindas ao nosso curso Ajax e vamos começar. 2. O que cobrimos neste curso: Bem-vindo ao nosso curso Ajax. Então Ajax é abreviação para JavaScript assíncrono e XML. Dentro deste curso, vamos guiá-lo através de como criar este tipo de formato onde usamos javascript para verificar o servidor. Então nós fazemos uma pedreira Ajax sobre o servidor, trazendo de volta uma resposta e saída nessa resposta dentro do nosso HTML e a melhor coisa sobre Ajax. E a coisa mais útil é que você não precisa ter atualizações de página. Então você pode ver aqui que o que quer que digitando aqui, isso está realmente passando pelo servidor, os servidores verificando esse valor para ter certeza de que na verdade não temos array configurado, e ele está verificando se isso está dentro do raio deles. E se tiver pelo menos três caracteres e se não estiver no raio deles, isso me diz que o nome está disponível. Mas se eu digitar um nome que está dentro desse ary, vai me dizer que só tenho que lembrar um nome que é usado. Então temos Jack Eso. Diz que o nome foi tirado. Eso mesma coisa para John nome é tomada, mas se fizermos algo uma variação dele isso não está disponível ou está disponível porque não está dentro que sendo retornado dentro dessa matriz que estamos usando em nosso servidor. Também vamos guiá-lo através de como retirar, usar um arquivo Jason e criar conteúdo em sua página HTML. Então aqui temos um monte de conteúdo aqui com construído em um questionário com um monte de perguntas, várias respostas diferentes e fomos capazes de realmente detectar se as respostas estão certas ou erradas. Eso simplesmente clicando nele, você pode ver se ele está indo certo ou errado dentro do nosso cônsul, nós vamos estar mostrando a você como fazer uma variação deste usando um arquivo Jason e puxando esses dados usando Ajax para construir sua página HTML requisitos para este curso são uma compreensão básica de HTML. Não vamos entrar muito no CSS. Nós vamos usar botas drop como nosso mecanismo de estilo, e nós não temos nenhum CSS dentro de qualquer um deste curso. E poderíamos estar falando sobre HTML básico, então pegando dibs, mas é essencial que você entenda isso. Javascript e trabalhar com o amanhecer. Então, mais tarde no curso vamos estar entrando em consulta J e como usar Ajax em J Query também. Então, uma compreensão básica de J. Query uma compreensão básica de javascript e Jason. Se você nunca viu Jason antes, nunca use Jason antes. Vai ser muito fácil de pegar, então eu não me preocuparia com isso. Mas é algo que vamos ser incluindo dentro deste curso é, Bem, Bem, nós vamos estar correndo através de Jason e trazendo esse arquivo Jason como um arquivo de dados dentro de nossa adição de documento html. Nós também vamos incluir todos os arquivos fonte que vamos usar ao longo do curso s para que você possa vê-los aqui no topo da minha página. Aqui está, então vamos incluir todos esses arquivos fonte. Então você vai ser capaz de baixá-los e trabalhar com eles por conta própria e testar o código. Portanto, é muito importante praticar o código para se familiarizar com ele e ser capaz trabalhar melhor com ele e personalizá-lo. Teoh, terno. Quaisquer que sejam suas necessidades para o Ajax, então, quando você estiver pronto para começar, vamos começar. Abra seu editor de texto favorito. E novamente, se você não tem um editor de texto, temos um monte de código aberto para download que estão disponíveis na seção de recursos deste curso. 3. o que é AJAX: Bem-vindos ao nosso curso de Ajax, e dentro deste curso, vamos passar pelo que o Ajax é e como usá-lo. Então Ajax não é uma linguagem de programação, mas é um padrão que é usado para se comunicar do servidor para a página da Web . Portanto, sem recarregar conteúdo no site, você pode realmente obter resultados dinâmicos. E então o que, dentro deste exemplo, o que estamos olhando agora, então estamos digitando um nome e esta é uma simulação de se você deseja verificar se um nome de usuário já existe e podemos ver aqui que se nós acertarmos um usuário nome que existe dentro do sistema, ele diz nome é tomado, nós também temos a capacidade de apertar o botão para fazer a verificação é bem. Mas acabamos de fazer a função key up aqui dentro do Javascript, onde sempre que você está digitando e a chave para cima, ele faz essa verificação aqui, um swell eso você pode facilmente trabalhar isso em um formulário. E você provavelmente os vê com bastante frequência sempre que tiver esses formulários dinâmicos, onde você pode criar um nome de usuário onde ele verifica. Se o nome de usuário estiver disponível ao inserir qualquer conteúdo que você está fazendo aqui . Então, essencialmente, o Ajax só permite que você tenha essa capacidade dinâmica de obter conteúdo em seu site e alterá-lo Como você está colocando o conteúdo aqui, ele permite que você alterá-lo em sua visão também. Então, trabalhar com javascript, isso funciona incrivelmente bem no Ajax é abreviado para JavaScript assíncrono e XML. Então, em outro exemplo, vamos estar falando sobre como podemos carregar um arquivo Jason inteiro e criar este teste dinâmico aqui apenas usando JavaScript, Ajax e um arquivo Jason. Então, se você olhar para a fonte disso, você vê que realmente não há nenhum tipo de html aqui dentro. Isto é tudo carregado do Jason, e depois temos os nossos pedidos aqui, isso vamos passar por isso também. Dentro deste curso, também percorremos as diferentes funções do Ajax e JavaScript, e a única coisa importante a lembrar onde a coisa mais importante a lembrar com Ajax é que permite que você altere o conteúdo em seu site sem ter uma página, recarregar, procurar, descarregar arquivos externos e/ou envios de formulários ou qualquer coisa que você queira fazer. e permite que você obtenha uma resposta de um servidor. E isso realmente Deus permite que você tenha muita habilidade dinâmica dentro de seu HTML apenas usando JavaScript sozinho? Acabei de ver o arquivo do Jason. E como você pode ver aqui, este é o arquivo Jason que está criando o questionário que estamos vendo anteriormente . E você pode ver que é muito simples. É muito fácil de usar e este é o padrão que vamos usar. Padrão preferido sobre XML. Está se tornando cada vez mais popular usar Jason sobre XML, mas você pode usar Ajax com XML. Você pode usá-lo com Jason, bem como diferentes fontes de retorno. Para os dados do servidor, eu colocaria informações. Então aqui, isso está usando uma forma adjacente aqui. Só estamos limpando o servidor. Então estamos limpando para o servidor e estamos verificando se esta entrada estava configurando sobre as informações de entrada daqui para o servidor e nós estamos apenas verificando para ver e o servidor está determinando o que estamos colocando aqui na parte inferior 4. Campo de formulário dinâmico Verificar com AJAX JavaScript: Na lição anterior, tínhamos olhado para este formulário Ajax onde você poderia inserir uma informação e ele faria uma verificação dinâmica para o servidor para verificar se há disponibilidade para o nome. Então, se nós cansamos um nome como John, vemos que o resultado seu nome é tomado. Também incluímos um botão aqui para verificar o conteúdo. Eso Isto é se expandimos nossa forma ou se você quiser ter algum outro gatilho para fazer a verificação Ajax real para o servidor s. Oh, este é apenas mais um gatilho que faz a mesma verificação para o servidor. Então ele vai executar a mesma função. Agora vamos olhar para o código e o código aqui abaixo para o HTML. Então nós temos nosso JavaScript aqui no topo e nós temos basicamente configurar uma função JavaScript e, em seguida, temos todas as nossas informações Ajax aqui e, em seguida, apenas aqui abaixo , dentro do corpo do HTML, nós temos tem o nosso campo de entrada e tudo o que fizemos aqui é que adicionamos na chave para cima e estamos executando esta função na tecla para cima. Então, sempre que alguém está interagindo com o campo e eles fazem isso. Ele executa esta função que executa uma verificação. E faz esse pedido Ajax sobre o nosso servidor. Então verifica em nosso arquivo de servidor o arquivo PHP envia esse valor de nome que o valor de nome de usuário do campo de entrada sobre o servidor e, em seguida, faz uma verificação. E como eu mencionei antes deste botão aqui, ele está atualmente ele não está sendo usado quando fazemos essa verificação dinâmica na chave para cima. Mas deixamos isso aqui dentro deste exemplo, a fim de indicar que existem diferentes maneiras de iniciar este gatilho eso Você também pode adicionar eventos de escuta e outros tipos diferentes de maneiras de acionar essa função. Então o processo é que, desde que você esteja enganando a função em algum momento ou qualquer ponto que essa verificação será necessária, é quando ela vai acionar essa função. Ele vai fazer essa chamada para o servidor e apenas começar a olhar para o arquivo do servidor rapidamente. Então isso não vai ser muito profundo no PHP. O que temos aqui é que só temos um nome. Então nós estamos apenas fazendo get name e estávamos retornando essa informação de nome de usuário no PHP. Então podemos usá-lo como uma variável dentro do PHP, e nós dissemos, Ah, os usuários são ray eso. Você também pode fazer isso de forma diferente. Se você tem um banco de dados, você pode fazer uma conexão de banco de dados para verificar se o nome existe I ou o que você deseja fazer para trazer o conteúdo que você deseja verificar suas informações existentes. E isso é o que queremos dizer por interagir com o servidor. Porque o próprio JavaScript não pode interagir com o servidor. Então ele precisa de uma linguagem construtora em segundo plano para fazer a interação eso, se é PHP ou se é alguma outra linguagem construtora ou se você simplesmente tem no arquivo de saída. Você pode usar o Ajax para interagir com esse arquivo de saída, então ele não está realmente olhando para nada. É só olhar para este arquivo e verificar essa informação de resposta. Então, mesmo que estivéssemos indo para aquele arquivo PHP por si só e se fizéssemos algo como nome é igual a John, ele retorna de volta. O nome é tomado. Se voltarmos algo abaixo que vemos que o mesmo resultado as necessidades de mais três caracteres, e isso é a causa desta declaração condicional. Eso dentro do PHP estamos apenas fazendo uma string length eso que estamos tomando neste valor que recebemos da variável request of name foram tomadas nessa configuração de valor como uma variável chamada name. E então aqui nós estamos fazendo um comprimento de corda. Estamos verificando para ver o tamanho deste nome, que qualquer que seja o comprimento de caracteres disponível dentro desta variável vai ser retornado aqui. E se for menor que quatro, então esta condição é atendida e nós ecoamos. Precisa de mais precisa ter mais de três caracteres. E se esta condição não for atendida, ele olha para outra coisa. E é aí que temos outros dois. Outra declaração condicional. Eso mais. Então isso não é cumprido. Se for menos de quatro, vamos colocar isso. E se for mais do que quatro, vamos olhar para esta outra condição aqui e aqui. Estamos fazendo uma verificação para ver se está dentro do raio deles. Então, estamos verificando para ver se o nome está na matriz do usuário e se ele retorna positivo. Então, se esta condição novamente, se esta condição for verdadeira, ela voltará. Só vai ecoar. Nome é tomado e caso contrário, se o nome não é tomado, e é maior do que quatro. Vai ecoar. O nome está disponível. Esta é a nossa lógica, e a sua lógica pode ser diferente dependendo do que está a tentar alcançar com esta forma . Eso só tem que ter certeza de que faz sentido quando você trabalha através dele. E se você não está familiarizado com PHP, tudo isso é uma muito simples, declaração condicional muito simples,muito simples, e eco apenas produz essa variável ou essa informação de string para a página da Web no navegador da Web. Então isso é tudo o que realmente está fazendo aqui, e é isso que essa função PHP está fazendo. E esta é a mesma função que estamos chamando do nosso formulário Ajax. E vemos aqui que quando executamos essa função Ajax, ele faz consulta para este arquivo de taxa PHP e ele retorna qualquer valor que está sendo produzido aqui. Então vamos entrar mais no código do formulário, e podemos ver aqui que é aqui que estamos fazendo que estamos abrindo. Estamos fazendo uma solicitação get para verificar o ponto PHP e estamos enviando um nome longo igual a nome de usuário . E esse nome de usuário é o valor deste campo de entrada que nós pegamos aqui, então nós apenas chamado nome de usuário e nós estamos fazendo tem documento, get elemento por i d nome de usuário valor ponto e que está retornando isso. Seja qual for o valor disponível quando este campo de entrada, ele está retornando como esta variável e nos permite usar isso dentro do JavaScript. 5. Como configurar a verificação de navegador XMLHttpRequest: dentro desta lição, vamos obter mais sobre como quebrar este pedido Ajax e o que tudo isso significa . Então ele parece um pouco de codificação, a fim de obter esse resultado. E certamente é muito mais fácil fazer isso com Jake Preocupação, o que também vamos mostrar em uma lição mais tarde. Mas é importante entender os fundamentos. E com o JavaScript é um pouco mais fácil entender o que realmente está acontecendo nos bastidores e o que tudo isso significa é importante para entender o que está acontecendo nos bastidores. Então aqui temos este H T h m l ou XML. Http e o que estamos fazendo isso é configurar este novo H XML. Http request eso O que estamos fazendo aqui é que estamos apenas fazendo uma verificação para ver se isso está disponível. E se isso não estiver disponível dentro da janela, eso também dentro deste curso é importante. Entenda como funciona o amanhecer. E se você não está familiarizado com o Dom, é aqui que todos os elementos HTML são carregados em javascript. Ele nos permite ter acesso e uso desses elementos Então, se fôssemos fazer algo como console, janela de registro ou documento lei console. Só vou mostrar o que acontece aqui quando eu for para o navegador. Então estamos usando nosso console aqui. Estamos usando cromo porque ele realmente não tem um bom cônsul, e nós podemos realmente fazer isso um pouco maior, então é mais fácil de ler. E então o que fizemos aqui é que acabamos de fazer um log de console, e enviamos todos os valores da janela para o console para que seja legível para nós. E aqui é onde temos todas essas diferentes funções, variáveis e valores que são acessíveis. Então isto é o que é conhecido como o Amanhecer porque agora temos acesso a toda esta informação. E para este, o que estamos fazendo é que estamos fazendo uma verificação para ver se as solicitações HTTP XML da janela existe. E se ele existe e basicamente tudo o que significa é que ele está apenas verificando para ver se é um navegador moderno. E se nós somos capazes de fazer este tipo de solicitação dentro deste navegador eso aqui nós vemos que nós temos isso. Ele existe mesmo. A solicitação http XML x realmente existe. Eso Isto é porque é um novo navegador ou um navegador moderno s navegadores mais antigos, como eu e cinco ou I E seis Use o X ativo em vez do XML. Http. Pedido, uh, e é por isso que estamos colocando isso aqui. Então isso não é realmente necessário para nós para operar ou executar que Ajax chamado dentro do chrome porque chrome é um navegador moderno. Então, não, nada disso é realmente relevante até que você realmente acessá-lo com um novo navegador antigo. E então você precisa que Activex para o Ajax funcionar. Então, isso é para as versões mais antigas de I e D I E s cinco ou seja, seis e talvez até mesmo i sete eso dependendo da versão mais antiga. Então isso está se tornando cada vez menos relevante, na verdade. Então, se você não está incluindo isso e se você não está esperando pessoas em navegadores mais antigos, então você realmente não precisa se preocupar com isso, mas geralmente boas práticas apenas para incluí-lo, apenas no caso de alguém aparecer em um navegador mais antigo e eles precisam usar Activex em vez do valor de solicitação http. Então, com o amanhecer, podemos ver aqui que somos capazes de criar este novo objeto e estamos amarrando essa informação de objeto como chamado pedido Ajax. Então definimos nossa variável. Estão ligando a pedido do Ajax. E aqui, estamos usando essas variáveis, e vamos usá-lo com bastante frequência, como você pode ver aqui dentro do código, uh, que estamos usando isso agora que estamos definindo como um novo objeto de XML. Http, pedido e inconstante volta aqui, podemos ver que temos algumas informações aqui que podemos olhar através e temos o nome dele para string. E nós temos algumas outras informações aqui está bem, dentro disso. Desculpe, caras terminaram tiveram um carregamento recebido. E esta é apenas a comunicação entre a diferença. Http. Solicitar objetos. Eso Isto é o que está sendo devolvido para este. E isso nos dá a capacidade de fazer essa solicitação do nosso navegador atual. E isso é provavelmente mais fácil de entender se você entende trabalhar com o amanhecer s. Então, se você não está familiarizado com o trabalho com o dom, nós realmente temos um curso que irá passar por todos os diferentes objetos do amanhecer e como usar A alvorada. Então, vamos para a próxima linha. Então aqui estamos apenas configurando este objeto. E se não conseguirmos configurar em um navegador moderno, configuramos o objeto usando o Activex para navegadores mais antigos. E isso é tudo o que isso está fazendo. Então o que podemos fazer é apenas espaço que um pouco é o que entendemos que passamos por isso. Acabamos de configurar este objeto que pegamos. Chamamos isso de pedidos de Ajax. Então, novamente, apenas uma variável. Pode chamá-lo do que quiser. E, em seguida, aqui está apenas configurando as informações do objeto nesse valor. Então tudo isso é isso significa que somos capazes de trocar dados com o servidor usando o Ajax. 6. Dados de formulário AJAX enviar GET POST: Então vamos olhar para o fundo do pedido do Ajax. Aqui está tão aqui. Temos um pedido do Ajax. Então, novamente, usar este objeto nisso é configurar essa comunicação nos bastidores. Então estamos fazendo pedido Ajax e estamos fazendo aberto e o que isso está fazendo. Isto é apenas especificar o método e, em seguida, a garota que vamos usar e se é assíncrono Então, se estamos fazendo verdade, isso significa que estamos fazendo um síncrono Se estamos fazendo falso, isso significa que estamos fazendo síncrono. E a principal diferença entre o assíncrono e o síncrono é que assíncrono. Quando isso é definido como true, isso significa que estamos esperando por uma função que vai ser executada uma vez que a resposta está pronta. Então, uma vez que tudo está pronto, então nós vamos passar e nós vamos executar a função, mas apenas quando é quando o evento de mudança de estado on ready for verdadeiro. E o que isso significa é que quando temos um valor que é retornado aqui, então somos capazes de completar isso e isso é o que uma sequência assíncrona e síncrona . E na maioria dos casos, você vai estar definindo como verdadeiro como síncrono, mas se você está definindo como falso, então você tem que realmente manter essa mudança. Isso é get elemento por I d resultado em nosso HTML, você deve fazer isso depois que o envio foi concluído porque ele não vai mais ser executado em um síncrono. Ele vai ser executado depois, mas novamente, geralmente, geralmente, é melhor mantê-lo como verdadeiro por causa do fato de que se você tem quaisquer problemas ou problemas conexão, você quer que o peso do dedo do pé através para carregar o seguinte. Se for realmente necessário para esse dedo do pé, trabalhe dentro do seu JavaScript. E a maior parte do tempo quando você está sentado em função Ajax ou qualquer chamada de Jack, vai ser uma ness n Shal parte do que está acontecendo no site. Então você quer defini-lo como verdadeiro, e é sempre melhor mantê-lo como verdadeiro. E então aqui, é claro, temos a URL, então estamos apenas enviando todos esses dados. Estamos enviando como dentro do arquivo PHP que aceitamos. Eu recebo o valor do pedido, e é isso que estamos fazendo aqui. É que isso que isso nos permite realmente facilmente incluir esse valor nome dentro Ah obter. E aqui temos o nome PHP verificado igual e, em seguida, o valor do nome do usuário. Então, novamente, a diferença é entre get e post. Na maioria das vezes, eu dependendo do que seus requisitos novamente são, é que há as diferenças entre obter e postar. E você só tem que estar ciente do fato de que get não é tão seguro quanto cartazes, bem como se você está enviando uma grande quantidade de dados, vai ser muito mais difícil de enviá-lo e obter. Então seria com post, porque post realmente não tem limitações de tamanho. Depende das configurações do seu servidor, é claro, mas você pode enviar um monte de mais dados no post, então você pode obter. E também se você não quiser, se você não quiser que o arquivo seja armazenado em cache. E se você estiver atualizando um banco de dados no servidor algo assim, você pode querer enviá-lo como post em vez de enviá-lo como get. Mas neste caso, porque temos lá Ray, e não vai ser realmente algo que estamos tentando bloquear para este tutorial . Estamos apenas mantendo-o como obter, mas novamente você tem essas opções para que você possa fazer postagem. Mas, em seguida, você tem que alterar o formato de verificação em conformidade, bem novamente, se você precisa usar post e se você está enviando sobre dados de formulário criptografados, dados de formulário sensíveis, você tem que adicionar nesse valor post lá. Então o que eu fiz é que eu acabei de fazer uma atualização rápida aqui e eu também adicionei no cabeçalho de solicitação de conjunto eso que sabemos que tipo de informação de cabeçalho é. Então, se temos alguns dados de formulário sensíveis a dados de formulário, sabemos que tipo do tipo de conteúdo e, em seguida, aqui na parte inferior, nós adicionamos em onde acabamos de ter a função de envio lá. Adicionamos em nome igual e é assim que podemos passar esse nome de usuário. Então, se você tivesse valores adicionais aqui, você poderia fazer algo assim, adicionando isso e percentual E se você tivesse algo assim, você poderia adicionar valores de nome adicionais dentro desse tipo de formato. Então isso agora enviará o sobrenome também. Mas isso não será necessário. Dentro do nosso exemplo, vamos manter isso fora. Eso Quando eu mudei o post aqui, eu também tive que mudar o post no arquivo PHP. E quando eu vou até aqui e atualizá-lo, eu posso ver que ele ainda está funcionando. Tudo ainda está funcionando como antes, exceto que estamos usando post. E agora, quando eu atualizá-lo aqui, nós não somos capazes de obter o valor do nome mais neste arquivo PHP. Então ele está apenas retornando esse valor padrão. Então, mesmo quando passamos por seis caracteres ou quatro caracteres, ele não está mais funcionando porque nós não temos que entrar aqui mais que nós estamos apenas fazendo post eso novamente. Se você estiver usando bancos de dados, você deve sempre ter certeza de que você está usando post porque você não quer que alguém seja capaz de acessar seu banco de dados e para fazer um monte de consultas para este endereço e ser capaz acessá-lo dessa forma. É sempre uma ideia melhor, mais segura 7. AJAX readyState: Então, na última lição, falamos sobre o envio de dados para o servidor. Eso O que precisamos fazer também incluir em nosso pedido Ajax é algo para lidar com isso se temos ah servidor solicitação e somos capazes de receber informações do servidor e isso é o que isso está fazendo aqui. Isso é apenas verificar e receber essas informações e capturar os dados que estão sendo retornados do servidor. Então aqui estamos fazendo o cheiro dos dados para o servidor. E novamente, isso vem em por que estamos usando verdadeiro e assíncrono porque estamos procurando para quando ele termina de carregar. Então não vai executar a função de mudança de estado pronto, e isso é o que vai ser incluído aqui. Então, se o estado pronto é igual a quatro, quando o status é igual a 200, então nós produzimos isso. E o que significa mudança de estado pronto é que isso realmente armazena essa função e sempre que o estado pronto muda, então uma vez que isso é armazenado dentro do JavaScript, então ele passa e lê tudo isso e diz, Ok, bem, uma vez que isso realmente esta função de estado pronto uma vez que realmente faz mudança foram capazes de executar esta função. Então ele se lembra disso e sabe que vai executar isso, mas só quando o estado pronto for verdade. E também, é importante lembrar que toda vez que esse estado pronto muda, isso realmente executará essa função. Assim, sempre que houver uma mudança neste estado pronto, esta função será realmente executada. E então, quando vamos até aqui e vemos estado pronto é igual a quatro e estamos verificando o valor de estado pronto e agora que quando ele faz igual para foram realmente capazes de saber que temos resposta, que a resposta foi concluída e que somos capazes de obter nossos dados. E é por isso que aqui estavam definindo esse HTML interno para o nosso texto de resposta. E novamente, esta é a solicitação de informações do Ajax. Então eu adicionei em Ah, console aqui, console logout de solicitação Ajax. Só para termos uma idéia melhor do que está acontecendo aqui então novamente, uma vez que o estado pronto muda, então ele vai disparar esta função e executar este código, e parte do código agora vai para bloqueios de console será capaz de mostrar a você o que é saindo dentro deste formulário de dados até que haja alguma interação ou até que a função seja executada. Na verdade, não estamos vendo nada dentro do console. Então, quando eu executar a função, vemos que nós temos esta solicitação HTTP XML e nós temos nossas informações retornadas. Eso aqui, temos a nossa resposta. Também temos o nosso texto de resposta aqui. Temos a resposta. Você é l e este é o status que estamos procurando. Então status de 200 e nós temos nossa função de estado pronto. Então novamente, isso é novamente Esta é uma função que sempre que muda e podemos ver aqui há informações muito mínimas aqui. Mas há um escopo de função lá e algumas informações adicionais que nós não vamos realmente entrar em. Mas é importante lembrar que esta é uma função em vez de algo como texto de resposta. E isso é apenas retornando esse valor de string, bem como o texto de status. Tudo bem, Eso Isso apenas nos dá alguns comentários sobre o que está acontecendo com este http ex XML, valor de solicitação e já estado novamente. É quatro. Então, na verdade, é por isso que estamos procurando um estado pronto de quatro e isso significa que sabemos que ele foi concluído. E sabemos que o status é igual a 200 significa que é um sucesso. Então, se você não quer tê-lo em sucesso, se seu servidor está retornando algo diferente de alguns valores de status. Então, se você tem como 400 ou o que quer que você está definindo para dentro do servidor, você pode querer olhar para diferentes opções para isso. Uma ondulação. Mas estamos apenas olhando para um padrão de sucesso aqui e um bem sucedido, hum, pronto estado de quatro. E isso é tudo. Tudo o que significa é que somos levados de volta, e estamos vendo que há alguns dados que estão sendo retornados aqui e novamente . Isso também pode ser realmente personalizado também. E você pode olhar para os diferentes status, seja sucesso ou falhas e/ou erros, e você pode produzir os dados de acordo. Então aqui temos o que acontece quando esses dois critérios são atendidos. Então, quando o estado pronto é igual a quatro e status é igual a 200 vamos documentar ainda elemento por resultado I D e isso é ah, este elemento e nós apenas mudar que HTML interno interno e estamos carregando novamente que solicitações Ajax . Então a mesma coisa que temos no registro do console aqui e temos nosso texto de resposta. E então voltamos para o nosso console. Você vê isso? O que estamos a fazer é carregar isto. As informações retornadas precisam ter mais de três caracteres, e as informações retornadas serão alteradas. Então, agora, quando descermos, você pode ver quantos pedidos diferentes foram feitos. E aqui estamos vendo que as respostas estão mudando, então todas elas devem enviar de volta o status 200. Quando temos algum texto de resposta lá e novamente, você pode retirar qualquer um desses valores e usar o polegar. Então, se você quiser ver qual é a resposta que você é, eu é se você quiser registrar isso ou se você quiser escrever isso em algum lugar, você pode puxar isso também 8. Revisão de resumo de formulário dinâmico AJAX: dentro desta lição. Vamos apenas fazer uma revisão rápida fora do documento do formulário, o formulário HTML e o JavaScript envolvido nele. Então, como podemos ver aqui, temos nossa forma básica. O que ele está fazendo é consultar o servidor e apenas verificando se esses nomes estão sendo usados. E agora nós só temos na chave para cima. E o que acontece é que quando temos uma chave para cima, ele executa esta função. Então é apenas um simples JavaScript aqui dentro do campo de entrada s Nós não estamos realmente usando este botão, mas nós vamos mantê-lo aqui também neste Este arquivo vai estar disponível dentro dos documentos deste curso. Eso Quando nós manter-se, ele executa a função, e esta é a função. Então nós configuramos essa função aqui como um pedido Ajax. Estamos pegando o valor do nome de usuário deste campo, então eu d nome de usuário. Estamos pegando esse valor fazendo get elemento por i d valor ponto para retornar essa informação de valor . E então o que estamos fazendo aqui é que estamos fazendo em http solicitação eso se a janela que tem a capacidade de solicitação HTTP XML. E, em seguida, ele vai definir solicitação Ajax como uma nova função de solicitação HTTP XML e se ele não está disponível. Então, se a janela não é uma janela moderna ou não um navegador moderno, devo dizer que ela vai configurá-la como um objeto Activex ou Activex. E assim uma vez eso estes ar fazendo a mesma coisa apenas dependendo do navegador é tão agora que nós configuramos pedido Ajax que vai conter esta informação objeto. Nós somos capazes de usar Ajax Request e verificar em Ready State. E o que isso vai fazer é quando o estado mudar, ele vai saber que ele vai executar esta função. Vai verificar o estado de valor pronto. Eso estava voltando. Estamos verificando um valor de estado pronto de quatro, que significa que há dados e eles estão prontos e 200 apenas significa que o status é bem-sucedido. E daqui estamos apenas fazendo de novo. Obter elemento por i d resultado e isso é apenas por aqui. I d resultado definindo que HTML interno para Ajax solicitar texto de resposta. Então nós estamos usando este objeto de solicitação Ajax e nós estamos puxando para trás esse texto de resposta e que era a mesma coisa que nós estamos olhando para cima no console. Então, basicamente, isso é preencher que inter html com quaisquer valores sendo retornados de lá e, em seguida, indo em frente. Só estamos fazendo isso. Estamos usando post agora, eso antes de usarmos get e estamos enviando o valor sobre e obter. Mas dentro deste, nós atualizamos para postar. Então, isso é mais seguro novamente porque estamos enviando dados de formulário que tivemos que passar neste cabeçalho solicitação. E aqui temos cheque. Então isso é apenas que você, Earl ou no local do arquivo do servidor que você está procurando para interagir e enviar os dados para isso novamente, ele não precisa necessariamente ser arquivo PHP ou qualquer outra coisa. Pode ser qualquer tipo de arquivo. E o que quer que seja produzido nesse arquivo, ele só vai sair dentro desse campo aqui essencialmente, isso é tudo que essa função está realmente fazendo. Mas nós, porque temos algum código de servidor aqui, somos capazes de torná-lo mais dinâmico, então ele não estaria apenas retornando um conjunto de valores. Está devolvendo qualquer coisa que viu escrito aqui e, em seguida, o último aqui que estamos fazendo? Quando estamos fazendo nosso envio, tivemos que enviar Ah, valor do nome de usuário. E novamente, esse nome de usuário é o valor que está disponível nesse campo de entrada. E só estamos pegando isso aqui no Ajax. Solicite e nome de usuário aqui. Documento get elemento por i. D usuário chamado Value. Então também podemos fazer isso aqui em baixo. Uma onda se quiséssemos, mas geralmente é melhor apenas quebrar isso e usá-lo como uma variável. E mais uma vez, usar o get vai ser mais rápido. Mas se você tem um monte de dados e se você precisa ter dados seguros, você deve estar usando post e então tudo o que temos aqui é apenas nós temos nosso HTML padrão . Então este é apenas um campo de entrada, um botão e um diff. E novamente, este site, o código para o formulário vai estar disponível dentro dos arquivos fonte deste curso s. Você é bem-vindo para baixar isso e trabalhar com isso e experimentar isso 9. Dados JSON como um objeto no arquivo JSON vs JSON usando AJAX: na lição anterior, analisamos o carregamento e a comunicação com um servidor, recuperando algum conteúdo dinâmico usando o Ajax. Então, nesta lição, vamos falar sobre isso também, obtendo conteúdo dinâmico do servidor. Mas desta vez, aquele arquivo Ajax vai realmente construir onde essa conexão Ajax vai se conectar a um arquivo Jason, e ele vai construir todas essas perguntas que temos e vai criar dinamicamente este quiz que nós que criamos. Então isso é tudo apenas usando Ajax, Jason e Javascript. Então agora vamos passar pelo código e o código para este documento que HTML vai ser muito simples. Tudo o que temos é igual a saída. Na verdade, estamos usando botas bootstrap eso. Drop está apenas nos permitindo ter um pouco mais de estilo e algumas partes mais visualmente atraentes para a nossa forma. Então, na verdade, não é necessário. Então, se eu apenas remover isso, e se eu voltar para o formulário e se eu atualizá-lo, vai parecer um pouco diferente. Então não é tão estilizado. E se você não está familiarizado com Bootstrap, nós temos outro curso que falamos sobre bootstrap também. E realmente funciona. Onde permite que você crie conteúdo. Muito bom conteúdo. Rápido. É ah CSS HTML framework JavaScript. Isso poupa-te muito tempo. Portanto, vale a pena olhar para o seu permite que você para o design responsivo. Então o que fizemos aqui é que temos apenas nossa saída e aqui estamos nos conectando. Então, inicialmente, o que fizemos em cursos anteriores, onde temos nossos Jason Js. E então somos capazes de analisar todas as informações do arquivo de dados do Jason. Então, se nós temos algo como Jason Js eso o que isso é isso é apenas configurar um objeto de dados e ele está nos dando informações dentro desse objeto. Então nós poderíamos literalmente trazer isso para o nosso arquivo uma ondulação, e nós poderíamos analisá-lo como Jason. E quando fazemos isso, vemos aqui quando carregamos essa página. Então eu tinha para chegar a uma NCAA significava aqueles, então eu só vou atualizar isso para fora no console. E isso é apenas para fins de demonstração. Este não é realmente o arquivo Jason que vamos usar, mas você pode ver aqui que unp arsed ele apenas Não é um formato realmente utilizável para objetos, mas quando o analisamos, vemos que ele se torna um formato utilizável para objetos foram capaz de passar por esses objetos diferentes. Nós somos capazes de escolher algo como conteúdo e conteúdo cabeçalho e foram capazes de construir todas essas informações em HTML Page eso Nós só temos um exemplo disso aqui onde se queremos construir para fora, obter Jason Page, Podemos olhar agora que trouxemos isso como um objeto e podemos ir para a página, podemos ver Main Page s Oh, isso vai ser Jason Dot páginas vai ser igual página principal. E quando eu atualizar o que combina, devemos ver que dentro do nosso registro do cônsul aqui que temos uma página má. Então o que ele está fazendo é colocar tudo isso, alguns dados do tipo Jason como um objeto e isso faz dele um objeto utilizável dentro do javascript. E quando eu vou para um site como Jason Lint, você pode ver que ele não vai funcionar muito bem porque nós ainda temos esses dados variáveis este ainda é um arquivo JavaScript, e quando eu copiar este código para fora e eu vou para Jason Lint, vamos ter alguns erros aqui. E isso é porque estamos definindo esse valor de Jason. Então, se fôssemos remover os dados da variável VAR, poderíamos apenas fazer isso definindo assim. E quando validamos, torna-se válido, Jason. Mas o problema é que se eu copiasse e colasse isso assim, na verdade não é. Não é mais um arquivo JavaScript legível. Então, agora, se eu fosse, volte para aquele host local para ver que eu vou obter alguns erros aqui porque este arquivo não é mais legível dentro do JavaScript porque ele não está configurando-o como um objeto ou um objeto legível. Então eu tenho que realmente voltar e formatado desta maneira porque lembre-se, este ainda é um arquivo de script Java e o que torna este realmente não a maneira mais ideal para obter o código na página. Então, embora ele vai funcionar, não é a maneira mais ideal de usar um dados Jason em sua própria página porque você está apenas definindo um valor e objeto e você está trabalhando através dele dessa maneira. Então nós vamos apenas comentar tudo isso porque nós não vamos realmente precisar trabalhar com isso. Eu só vou tirar tudo isso do arquivo, e nós vamos realmente trabalhar com o nosso Jason, o nosso teste, nosso teste, arquivo do Jason. Então isso vai estar localizado no servidor dela também. Você pode ver aqui quando você vai para o quiz dot Jason, que é um formato muito legível. E se eu fosse realmente tirar tudo isso e se eu trouxesse para o fiapo do Jason e validá-lo, ele volta é válido, Jason. Então essa é uma boa maneira de trabalhar com Jason, mas vamos ter que usar Ajax para extrair esse Jason Data, a fim de torná-lo utilizável dentro do JavaScript. Então, vamos mostrar-lhe como fazer isso nas próximas lições. 10. AJAX pronto set go: Então inicialmente você pode estar olhando para isso e pensando Bem, você sabe que isso é muito diferente da forma em que nós realmente fizemos este pedido. Nós enviamos alguns dados e na chave para cima, nós consultamos o servidor, mas na verdade não é muito diferente. Nós ainda estamos fazendo esse pedido Ajax, e tudo o que estamos fazendo é sempre que a página ou o site iniciar, nós estamos apenas chamando sobre esta função. E, essencialmente, isso é tudo o que temos aqui dentro. Temos Onley este HTML configurado para fazer isso. Este é o nosso essencialmente ou recipiente nosso recipiente de saída, onde através JavaScript enfraquecer saída html dentro deste recipiente e, em seguida, dentro das tags de script. O que temos é que estamos chamando esta função. E agora é aqui que o Ajax realmente carrega a página. Então, não vamos esperar por ... nada ...qualquer tipo de gatilho para a disfunção do Raj. Quer que a disfunção corra imediatamente e preencha todas as informações do arquivo Jason diretamente em nosso html para o para que o visualizador possa vê-lo no navegador. E nós realmente não temos que enviar qualquer informação sobre por causa disso novamente. Este é um arquivo Jason que estamos pegando e estamos puxando de volta para o nosso JavaScript, a fim de usá-lo e construir essa página html. E é por isso que vamos passar nas lições posteriores. Como estamos construindo este digite html e como estão fazendo isso e também algumas opções adicionais que podemos adicionar neste quiz eso para agora o que estamos fazendo aqui. Estamos apenas conectando saída para obter elemento por saída i d. Então, novamente, se você não está familiarizado com o amanhecer, nós temos outro curso que irá orientá-lo sobre como usar o dom e como tudo funciona dentro do dom. Mas para esta lição, é apenas importante entender que estamos configurando essa variável. E é aqui que vamos produzir. São conteúdo, são cada HTML Então nós estamos apenas usando isso aqui em baixo mais tarde. E tudo isso está fazendo é isso está preenchendo esta div com este html interno e aqui é onde nós estamos apenas looping através e construindo esse html e, em seguida, apenas como o que fizemos antes na forma foram definir variável que vamos usar o nosso são objeto. Então, novamente, nós tinhamos chamado Ajax Request. Aqui, aqui. Acabamos de chamá-lo de Ajax. Mas, novamente, você pode nomear o que quiser, contanto que faça sentido. Sempre que você está lendo através do frio, então você é capaz de ligá-lo de volta para Ok, bem, bem, este era o Ajax, e isso é o que eu estava fazendo mais isso meu pedido Ajax. E então muito parecido com o que tínhamos na forma aqui. Procuramos essas funções de solicitação XML HDP p. E se isso estiver disponível dentro dessa janela, então ele está disponível dentro do navegador, ele vai ser executado através. Então, para todos os navegadores modernos, esse valor será verdadeiro. E se for verdade, então essa condição é atendida e Ajax é igual a novo XML. Http, método de solicitação e ele vai trazer toda essa informação em como um objeto. E aqui se não for verdade, então se não for um navegador moderno e se isso não estiver disponível, ele tentará fazer um objeto X ativo, e isso deve cobrir de novo, como explicamos antes de cinco e seis. E isso é configurar essa funcionalidade básica do Ajax. E depois disso, estamos prontos para ir com a chamada de valetes que vamos passar na próxima lição. 11. Conexão de arquivo AJAX JSON: então, seguindo ao longo do que fizemos na última seção onde nós configuramos o formulário que temos nosso próximo temos Então nós configuramos e verificamos nosso navegador para ver qual versão é e como nós carregamos nas informações do objeto sobre nomeação no Ajax. Então este aqui, é um pouco diferente. Chamávamos-lhe Ajax. E então aqui estamos fazendo Ajax dot open e novamente, a mesma coisa que estávamos fazendo aqui em baixo. Eso de novo. A ordem não importa tanto. Eso temos movido que na função de estado pronto abaixo eso aqui nós apenas tinha-lo acima. Mas novamente, isso não vai realmente importar porque enquanto ele sabe que sempre que o estado muda que vai executar esta função. E então nós colocamos isso realmente abaixo porque nós queremos rever este conteúdo primeiro e depois passar por cima das informações de mudança de estado pronto. Eso novamente nós estamos apenas usando get porque este arquivo Jason, é ele está disponível on-line de qualquer maneira. Eso se nós apenas fomos para Dot Jason nós podemos ser capazes de ver o arquivo Jason Então nós não estamos preocupados com a segurança como nós estávamos com o formulário no último. Então, estamos apenas usando get e novamente, queremos usar isso assíncrono. Então, queremos todos os arquivos abaixados primeiro. E quando estiver pronto, vai fazer com que eles criem essa saída. E, em seguida, além do aberto, temos definir cabeçalho de solicitação. Muito parecido novamente na forma em que tínhamos definido essa forma Earl codificado dados do tipo. Então, o tipo de conteúdo desta vez o tipo de conteúdo que estamos fazendo é aplicativo, Jason e novamente, estamos definindo isso como fizemos no formulário ou por padrão. Teria sido verdade. Eso aqui estamos apenas enviando esse cabeçalho de solicitação de conjunto de solicitações, e isso nos permite configurar para receber esse Jason Data e, em seguida, aqui, que você vai passar na próxima lição será o Ajax sobre mudança de estado pronta . Então, novamente, ele está procurando por esse estado pronto. E quando estiver pronto, ele vai passar e executar todo aquele código lá. E, finalmente, aqui temos apenas Ajax dot enviar e eso. Não há nenhuma informação que estamos enviando. Não há valores eso apenas colocado nulo lá. Você pode deixá-lo em branco ou você poderia apenas citá-lo. Ou pode colocar tudo aí, se quiser. E, em seguida, por último, eu tenho este ponto de saída inter html drive apenas tem encontrar. E se fizermos uma atualização rápida, você pode ver aquele achado aparecer lá em cima por um breve segundo. Eso Isto é se estamos tendo alguns problemas realmente recebendo essa página ou se conectar a esse trabalho. O arquivo Jason. Queremos ter aquele achado lá ou algum tipo de girador lá para que o usuário saiba que há alguns dados nos carregando. Nós não queremos que eles venham aqui e vejam enquanto há uma página em branco eso. O que isso significa Rate? Então, no caso do arquivo Jason não carregar, por qualquer motivo, não podemos acessar isso. Queremos ter algo para que o usuário possa ver quando chegar a essa página da Web e dizer, OK, bem, bem, agora ele ainda está encontrando esse arquivo. Então esta é apenas uma mensagem para o usuário. Mas o que está acontecendo aqui e, por fim, disfunção, vamos implementar isso mais tarde. E isso tudo o que isso está fazendo é este é este verificar se minhas respostas ar certo ou errado e apenas colocando essa resposta no console. E, claro, você poderia trabalhar com isso e criar suas próprias respostas não aqui dentro dessas perguntas. Então, na próxima lição vamos trabalhar sobre como estamos usando Jason, e estamos analisando Jason, como o que fizemos aqui no início. E então isso é analisá-lo em um formato utilizável que podemos então puxar através do código HTML e construir nosso pêssego HTML. 12. Dados de texto de resposta AJAX: Então novamente, muito parecido com o que fizemos informou html Estamos procurando por isso na mudança de estado, esta mudança de estado pronta. E uma vez que o estado muda, estamos procurando um estado de quatro e um status de 200. Então isso significa que todas as informações do Jason que o arquivo Jason carregou, então o ponto do teste Jason carregou. E se essa condição for verdadeira, e se tivermos os dados lá agora, podemos usar esses dados e é isso que estamos fazendo. Dentro desta lição, vamos falar sobre isso, e vamos falar através de todos os diferentes frios JavaScript que entramos aqui. Então, muito disso é apenas estilizar essa saída eso tudo o que realmente estamos olhando inicialmente vai ser este texto de resposta Ajax. Então, novamente, a mesma coisa que temos de volta aqui, onde recebemos um texto de resposta, nós apenas colocamos dentro do html interno. E isso foi apenas um texto muito simples que estava voltando daqui, onde eu realmente tenho um pouco mais complexo porque estamos usando um arquivo Jason. Então nós temos que analisar o Jason como o que fizemos aqui iria analisar hoje e torná-lo em um formato utilizável, colocando-o em como um objeto de dados. E novamente, este é apenas um nome de variável. Pode chamá-lo do que quiser. Eso acabou de chamar um dado para realmente simplificar o ponto de que estes são dados que recebemos de Jason eso aqui. Temos nossa saída em nosso HTML. Então, estamos apenas limpando qualquer entrada que possa estar lá, caso queiramos carregar várias perguntas. Múltiplos testes. Eso pode dar o uso da habilidade para fazer isso. Geralmente podemos definir isso através do envio de diferentes arquivos ou fontes do Jason ou o que quisermos fazer. Eso isso só limpa que Inter html e eu ia incomum thes logs console e assim você pode ver o que está realmente sendo respondido. Então, vai fazer umteste de dados, teste de dados, conteúdo e um nome de dados, porque se olharmos para trás no arquivo do Jason, temos dois objetos diferentes aqui, então temos nome. Então o nome dele é meu questionário, eu e então o conteúdo do quiz. E este é todo o conteúdo que está disponível neste questionário. Então, novamente, um monte de maneiras diferentes de formatar isso e estilo este eso Eu queria todo o conteúdo do questionário em uma página. Se você quiser todas as perguntas em páginas separadas novamente, um monte de maneiras diferentes de formatar o arquivo Jason e, em seguida, ser capaz de ler um através em seu JavaScript e saída como html eso aqui. Estamos apenas colocando o conteúdo do questionário e estamos recebendo o nome dos dados. Então, estamos analisando o texto de resposta. E este é o lugar onde eu estava realmente indo para trabalhar mais com informações Jason e arquivo Jason passado o Ajax porque uma vez que nós terminamos aqui, nós realmente completamos nosso processo Ajax e nós recebemos de volta esta informação do , e agora é apenas uma questão de trabalhar com ele e fazer com que ele se pareça com a maneira que queríamos olhar. Então, quando eu atualizar a página, você pode ver aqui que eu sou devolvido de volta o nome do questionário. Então isso novamente, isso está vindo do nome Ajax ou do nome Jason e, em seguida, retornamos de volta objeto, objeto, objeto. E aqui podemos ver que temos um objeto, mas ele contém todas as quatro perguntas como objetos separados. E então nós também temos as respostas como objetos. Então temos no objeto dentro de um objeto dentro de objetos. E então aqui temos a resposta correta vai ser uma. Estamos passando por um valor de imagem e um valor de pergunta. E novamente, a razão para trabalhar com o arquivo Jason Ele apenas torna muito mais simples e fácil ler, ao contrário do que estamos olhando antes, quando tínhamos aquele arquivo JS e tudo estava meio crocante juntos e não podíamos facilmente fazer alterações. Então aqui, por exemplo, se quisermos adicionar perguntas adicionais, será realmente tão simples quanto dar outro valor-chave e, em seguida, dar-lhe outro valor associado. E agora, quando eu atualizá-lo, eu deveria ter a pergunta número cinco e assim por diante e assim por diante. Então eu poderia literalmente adicionar em quantas perguntas eu quiser, contanto que eu tenha valores chave diferentes aqui, e eu possa fazer qualquer um destes correto, apenas mudando esse valor correto lá e então aqui eu posso mudar essa atualização, esse texto da pergunta, e isso é tudo o que só recebe saída aqui texto da pergunta. Então, agora que extraímos os dados e usamos o conteúdo do questionário, percebemos que no conteúdo do questionário há os quatro objetos diferentes e eles são todos e são todas as perguntas diferentes que temos disponíveis. Agora. Neste ponto, podemos começar a trabalhar com nosso texto de resposta, e é disso que estamos falando na próxima lição, simplesmente fazendo loop e trabalhando com ele. E quanto ao Ajax, esta será a conclusão do que precisamos falar para o Ajax. Porque depois deste ponto, estamos apenas Nós analisamos esse arquivo Jason e com analisado em dados, e agora podemos apenas trabalhar com ele como um objeto em JavaScript. 13. Como criar o HTML interno do arquivo JSON: Então, na última lição, analisamos como podemos obter esses dados do arquivo Jason e colocá-los em como um objeto JavaScript. Então, agora o que estamos fazendo aqui é apenas fazer um loop através do conteúdo do teste de dados. E se você se lembrar do último, ele vai apenas percorrer esses itens que estão disponíveis dentro desse objeto. E novamente, se formos acrescentar, se formos ao arquivo do Jason e se fizermos perguntas adicionais, podemos fazer isso facilmente. Pergunta cinco. E vou manter tudo igual. Na verdade, talvez eu remova esses parece um pouco diferente. E quando eu atualizá-lo, eu vou ter todos os diferentes todos os cinco objetos agora. E você pode ver que a Questão cinco agora foi adicionada à medida que estamos fazendo isso . E eu tinha realmente removido naquele console, então não somos capazes de realmente vê-lo dentro do console. Mas o conteúdo do questionário seria o mesmo. Então tudo isso foi esse loop através. Então, estamos fazendo loop através de objeto no conteúdo do questionário de dados e vai olhar através de todos os itens disponíveis no conteúdo do questionário. Eso o 1º 1 Uma vez que iniciamos o loop, estamos apenas definindo nossa saída. Digite HTML. Então, novamente, aqui nós limpamos nosso HTML interno e há muitas maneiras diferentes de fazer isso. Você poderia construir isso como uma variável e, em seguida, postado como enter html aqui na parte inferior para que você não teria que fazer tudo isso adicionando ou você poderia upend ele. São muitas maneiras diferentes de seguir, mas para esta lição, queremos manter tudo realmente simples e legível. Então, tudo o que estamos fazendo aqui saída digite html, estamos adicionando ou um conteúdo pendente nele. Então estamos fazendo o que quer que este externo embutido em HTML é igual. Dois estavam fazendo mais igual mergulho. Então nós apenas acrescentamos naquele divot, o topo e então aqui estavam fechando que fez isso. Nós criamos aqui de novo, maneiras diferentes de fazê-lo. Mas isso é apenas para legibilidade. A fim de trabalhar com o conteúdo JavaScript eso novamente inter html. E aqui estamos realmente agarrando aquele objeto de conteúdo do questionário e estamos pegando a pergunta. Então, qualquer objeto de valor é tão 01234 porque temos cinco perguntas diferentes aqui. Eso, qualquer que seja esse valor, ele vai retornar esse valor lá e ele vai pedir e obter uma resposta sobre a pergunta . E novamente, a questão está certa, aqui está então este é o valor chave. É apenas texto de pergunta, como é puxar para trás esses valores. Então eu só faço uma atualização rápida e você pode ver quando eu atualizar a página, isso deve ser questionado. Texto um atualizado Apenas para mostrar o relacionamento lá, e tudo o que estamos fazendo é apenas colocá-lo em idade para marcar HTML e colocar esse valor de retorno em sua. Também podemos fazer algo como respostas de log de console porque novamente, lembre-se, tivemos um monte de respostas possíveis, e isso, novamente é dinâmico. Então mude algumas perguntas em cinco respostas. Alguns tinham três. Alguns tinham 642 Então eu acho que cobrimos todos os valores diferentes lá. Mas sim, as possibilidades são infinitas. Você poderia adicionar respostas adicionais ou possíveis respostas se quisesse. Dentro desse questionário, e tudo o que estamos fazendo aqui é apenas fazer, hum, estamos tomando isso em configurá-lo como uma variável chamada resposta correta. Há apenas o Cônsul registrando isso agora para que você possa ter uma idéia melhor do que estamos listando aqui. E estamos escutando cada objeto. Estamos listando todas as respostas que estão disponíveis lá dentro do console lá. Então foi isso que acabamos de fazer lá com o console. E novamente, estamos pegando esse valor de correto assim como fizemos com a pergunta. Mas estamos pegando corretamente. E quando voltamos ao arquivo do Jason, vemos que cada um deles está correto. E seja qual for a pergunta certa, será a que será devolvida. Correto. Então isso não vai ser como a matriz onde estamos apenas olhando para esses valores estavam olhando para 123 45 e que vai ser o valor de retorno. Então nós estamos olhando para se ele tem um valor fora de um, que vai ser o valor correto. Então, apenas configurando isso como uma variável chamada resposta correta. E aqui temos a contagem inicial porque fizemos uma conta através de todas as respostas diferentes e novamente, estamos começando com zero, e estamos adicionando um a ele para que pudéssemos ter começado com um e feito essa adição aqui mais baixo à medida que nós percorremos através dele novamente, dependendo de como você quer fazer isso. Mas só por uma questão de legibilidade aqui, estamos definindo em zero, e vamos incrementá-lo aqui para um. Eso acertou. Então isso vai ser apenas gravar quantas respostas estavam ficando certas, e vai começar no zero. Então talvez pudéssemos mesmo tirar este daqui para fora deste espaço porque não queremos ter que agir necessariamente. Olhe através disso. E isso seria apenas um geral, talvez um placar ou algo assim. O que você quiser chamá-lo. Desculpe. Não, na verdade, não foi o placar. Então, se quisermos fazer uma pontuação, teremos que mantê-lo fora do circuito. Mas a razão pela qual temos aqui é que estamos definindo esse valor que estamos passando para a função minha resposta. E a partir daqui, vamos verificar se está certo. Então é por isso que estamos realmente definindo? Tem direito? 21 ou zero. Então, apenas um valor booleano e o que estamos fazendo aqui. Estamos verificando se a resposta correta. Então, de correto é igual a que começar a contar. E se isso acontecer, os valores podem ser um. Se não acontecer, vai ser zero. Então, se minha resposta é o valor de um que estamos passando, é apenas uma questão de verificar se esse booleano existe. E se ele existe, então nós fazemos a resposta correta. E se não existir, se falhar ou o retorno falso faria uma resposta errada se falhar ou o retorno falso faria uma resposta errada. Esse foi o meu erro. Não foi realmente o eso pontuação que poderia ser trabalhado na minha resposta lá abaixo. E logo abaixo disso, temos o html interno de saída novamente. Então estamos configurando esse HTML interno. Temos algumas aulas de botas aqui para efeitos mais elaborados. E também estamos configurando essas respostas. Hum, então outra opção aqui para styling você poderia também, se você quiser amarrá-lo em, se você está usando Jake preocupado, é um pouco mais fácil amarrar em uma classe eso, vez de apenas javascript nós teria loop através do dedo do pé, mas estamos definindo estes dinamicamente eso. Não podemos simplesmente fazer um loop através dele porque este conteúdo não está realmente carregado. No entanto, quando fazemos o evento, então nós poderíamos pegá-lo em ah, botão, clique e executar através desses valores se definir de valor lá ou poderíamos fazê-lo como, como fizemos aqui no clique Eso isso para este circunstância, este é provavelmente o uso, maneira mais fácil de ir. Mas novamente, se você estiver usando J Query, há outras maneiras de definir isso. E tudo tem a ver com o ouvinte eventos eso com. Se estamos usando apenas no clique, nós não temos que realmente definir ouvintes, e isso nos economiza um pouco, acordo Eles estão passando por isso. Então, tudo o que estamos fazendo HTML interno na saída. Então, novamente, saída aqui elemento por i d. Então dentro aqui é apenas adicionando neste código HTML que está adicionando no tipo de botão é um grupo de botões de classes lá no clique, e este é o lugar onde ele está enviando mais que tem taxa valor. Então é um ou zero, e um é correto. Zero é incorreto. E então aqui ele está apenas percorrendo todas as diferentes respostas que estão disponíveis. Então, novamente, se nós formos até aqui e IHS então eu ia mudar isso para que você possa ver que eles estavam realmente fazendo loop através do texto que está disponível. Há o pode parecer que estamos apenas fazendo loop através, mas não, mas não, nós estamos realmente tirando essa informação do Jason e estávamos colocando em cima do botão como HTML Zwerg, dando-lhe um valor lá. Então, voltando para isso é o que isso está fazendo é apenas fazer a mesma coisa que fez aqui com as respostas. Mas aqui, está nos dando qual resposta está sendo devolvida. Então, consulado desligou aqueles que consomem dançarinos do lago, mas aí está. Então, o que estamos fazendo é pegando um re de objetos e estamos listando eles . Então aqui temos todas as respostas diferentes que estão disponíveis aqui. E nós clicamos para baixo. Poderíamos ver, você sabe, responder. O primeiro valor 1 é respondido. Um. Se abrirmos este, podemos ver que os diferentes valores estão disponíveis lá e podemos ver o que está sendo retornado nos botões. Uma ondinha. Então aqui temos o primeiro objeto. Este é, uh este é o certo, e podemos ver que os sites de milho texto. E, finalmente, o que estavam fazendo? Estamos fechando essa div que abrimos no início, e isso completa nosso acúmulo do código HTML que estamos colocando dentro da saída. E este é o código completo que recebe saída aqui. Então o que ele faz é passar por aqui, percorre todos os botões que estão disponíveis e, em seguida, continua para o próximo item, percorre os lábios para os botões ao lado soltos através dos botões e assim por diante. E assim, até que ele chegue ao fim do arquivo e é por isso que este formato Jason lado é muito melhor e mais fácil de usar porque este aqui, qualquer um pode vir aqui e dizer, ok, bem, Você sabe, eu quero construir um teste. Vou ter que fazer a lista da minha pergunta. Eu tenho imagens aqui também, então se você quiser colocar imagens, você pode facilmente puxar para trás uma fonte de uma imagem aqui, colocar isso no HTML interno e ter as imagens atualizadas também. E se você tivesse várias respostas, eso algumas perguntas podem ter uma ou duas respostas. Alguns têm cinco, e isso realmente faz um formato dinâmico, dinâmico para criar esses tipos de questionários 14. Resumo de questionário JSON AJAX: Então, só para terminar o que estamos falando na última lição onde estamos construindo, que Inter html. Então, basicamente, ele constrói todo esse código, e então o que ele faz é coloca-lo dentro dessa saída. Div. E é aí que obtemos essa funcionalidade. Eso também tinha adicionado em Clique na minha resposta. Então, sempre que é clicado, enviamos minha resposta e qualquer valor que pudemos pegar aqui dentro desse loop. Então, sempre que for igualado, vai ser um. Se não for igual, será zero. Então esse valor vai ser colocado aqui dentro da função e enviado para a minha resposta, pego como e e lido em I d. Minha resposta é igual a E então eu também poderia fazer algo como apenas e. E eu poderia eliminar isso, e aquilo deve funcionar também. Então, agora, quando eu atualizá-lo, olhe para o console o quanto nós vemos que ainda estamos recebendo as respostas corretas e respostas erradas. E sempre, quando você estiver trabalhando com JavaScript, tente reduzir o máximo possível sobre a configuração e o código da variável. Às vezes, se você quiser ser capaz de documentá-lo melhor. É uma boa idéia incluir essas variáveis, mas para este exemplo, porque nós realmente não precisamos disso, isso foi apenas um passo adicional. Não precisamos disso. Se for um, vai aparecer. Se não for, se for zero vai fazer a resposta errada e, em seguida, aqui, indo mais longe, você poderia construir algumas funcionalidades adicionais, como já mencionamos anteriormente. Se você tinha uma pontuação, você quer marcar. Quantas respostas corretas você deseja desativar? Você quer esconder essa pergunta assim que for respondida. Você pode fazer isso também, dentro desse JavaScript e dentro desta minha função de resposta. 15. Introdução ao JQuery AJAX: na seção anterior. Nós tínhamos falado sobre formulários e apenas fazendo este tipo de verificação formulário apenas para ver se esses valores ar disponível dentro Honore ou poderia ser usado para um banco de dados on-line. Então, embora isso pareça bastante semelhante dentro daqui, nós vamos estar usando J Query, e há muitos benefícios para usar em J. Corey. Eu realmente amo usar J Query, porque ele realmente faz as coisas muito mais fáceis. Então, em oposição ao nosso código Ajax que tivemos que usar para JavaScript. Olhamos para o código J. Corey, e é muito mais simples, embora não estejamos fazendo exatamente onde não estamos enviando esse valor ainda. Vamos mostrar-lhe como fazer isso nas próximas lições. Mas por enquanto, o que estamos fazendo é que acabamos de configurar, acrescentamos a Biblioteca Jaqui. E se você não está familiarizado com Jake Worry, nós temos outro curso que fornece informações sobre Jake Worry eso bem, logo abaixo. Temos o campo de entrada, mesma coisa que tínhamos aqui. Nós removemos isso na chave para cima e no Click, e estamos apenas conectando ao adicionar aqueles ouvintes de eventos e gatilhos via J Query, e é muito mais fácil fazê-lo dessa maneira também. E Jake era realmente aquela chamada Ajax parece um muito, muito simples agora eso Por aqui, nós temos o tipo de botão. Então é o botão. Então, tudo a mesma coisa. Acabámos de lhe dar uma informação podermos ligar-nos a ele quando for clicado. E poderíamos executar essa função que está disponível. Então, por padrão, temos o nosso documento ponto pronto função s Então este é o padrão da consulta ah J. E mais uma vez ele vai trabalhar com o amanhecer. E quando o down estiver pronto e pronto, tudo é carregado e carregado no dom. Em seguida, temos acessibilidade a todos os diferentes aspectos e objetos que estão disponíveis dentro desse documento. E, em seguida, também usar a biblioteca de consultas G nos dá um monte de funcionalidades adicionais . Então, com o Jake preocupado, está tudo bem reduzido. Tudo o que estamos fazendo é identificar este elemento, então nós estamos apenas usando isso tão semelhante para obter elemento por I d. onde nós estamos apenas obtendo que eu d. Nós estamos pegando ele e nós estamos apenas adicionando esse ouvinte de eventos aqui dentro do J Corey Dom. Então, sempre que ele é clicado, sempre que isso eu d é clicado, nós vamos correr através desta função. E, em seguida, aqui nós estamos apenas pegando esse valor de nome de usuário e definindo-o em uma variável. E, novamente, há maneiras diferentes de fazer isso. Mas para os propósitos deste curso, estamos tentando mantê-lo muito simples. Tem que meu nome pegar o nome de usuário novamente, obter elemento por i d. e pegar esse valor de nome de usuário e colocá-lo em meu nome. E isso é tudo o que temos que fazer pelo Ajax. É muito mais simples do que o que tínhamos que fazer antes, onde tínhamos todas essas linhas de código para Ajax. Tudo o que temos que fazer é apenas fazer ponto Ajax estava chamando essa função Ajax em J query tudo para fazer o primeiro set que você é l E aqui temos que você é mais a mesma coisa que estamos fazendo aqui, onde estamos definindo aquela garota e simplesmente postando sobre esse valor que o valor da solicitação. Nós também tivemos que atualizar esse arquivo PHP para obter a requisição get em vez de postar porque ainda estamos enviando por. Obtenha agora e nós mostraremos como adicionar variáveis de valores a isso nas lições posteriores. E então aqui simplesmente temos. Se ele retornar sucesso, isso é remover todos esses pedidos estado pronto sucesso. Então, se ele retornar sucesso, nós vamos executar esta função. E isso está puxando todas as informações retornadas. Então, novamente, esse texto de resposta. Então, ele realmente foi simplificado em J Query, e nós estamos apenas chamando esse resultado. E aqui muito parecido com o que fizemos dentro do nosso JavaScript. Estamos tomando este elemento com a idéia de resultado, e estamos colocando enter HTML e estamos colocando neste elemento o que é retornado do servidor quando fazemos esta consulta. Então é realmente um simples é que, e nas próximas lições, vamos passar por isso como passar valores no post também. Usando J Query. E novamente, lembre-se, quando você estiver usando Jake, onde você tem que trazer aquela biblioteca J coury e para que ela funcione dentro de sua página. Então, se você deixar isso de fora, JavaScript não vai saber o que este cifrão significa. E não é dar capaz de interpretar e entender o que isso o que essas funções estão fazendo 16. Publicação de ajax JQuery com resposta de retorno de chamada: muito parecido com o que estávamos fazendo dentro do JavaScript. Temos a habilidade de definir um get ou um post. E o que estamos fazendo aqui é que estamos configurando que você é eu e então aqui temos nossa função de retorno de chamada. A função de retorno de chamada é o que acontece uma vez que este pedido é enviado e, em seguida, a função de retorno de chamada vai executar eso. Poderíamos fazer um resultado de desligamento do console. E vamos dar-lhe uma indicação sobre o que realmente está sendo devolvido. Quando lançamos esta função de get ou esta chamada de obter este Ajax chamado get to this u R l Então novamente, estamos usando esse checkdot PHP e mantivemos esse arquivo para nos levar. Podemos ver aqui quando almoçarmos. Essa função, vemos que o nome está disponível se pudéssemos. John, o nome não está disponível e tudo o que estamos recebendo aqui, é isso que está sendo devolvido. Então isso é tudo o que é devolvido. Então é um pouco diferente do que foi retornado quando estávamos usando esse Ajax aqui no JavaScript eso regular aqui nós estamos apenas obtendo esse resultado. E esses são os dados que estão sendo retornados, e também há outra opção para status. Então, se vamos realmente fazer status, podemos ver aqui que quando atualizamos a página, temos um status de sucesso muito parecido com o que estávamos fazendo aqui. Simplesmente se separou. O Eso está pronto. Estado ainda está retornando o mesmo status, mas ele entende que 200 é um sucesso que é intercambiável. E quando há dados, o status vai voltar como um sucesso. E aqui é onde podemos fazer algo semelhante onde estamos apenas fazendo aquela chamada inicial que o Ajax chama de sucesso e, se o seu sucesso, do que ele faz essa função. E se for um erro, pode fazer outra coisa também e tão facilmente quanto o que estamos fazendo antes. Se quisermos fazer postagem, só temos que fazer um pouco de reformatação aqui e atualizar isso para tomar um pedido de postagem . Volte para este formulário, então agora vamos enviá-lo como post e não podemos mais enviar a variável dentro deste tipo de formato, então temos que enviá-lo como dados disponíveis. Então o que nós vamos fazer, nós vamos apenas configurar esses dados, e eles são apenas algumas pequenas mudanças lá onde nós trouxemos sobre esse valor de dados lá. E então isso novamente pode ser separado por vírgula se você estava passando sobre um valor real. Então este é um valor JavaScript. Então não precisávamos citar. Mas se você tivesse um nome real lá e se você quiser passá-lo, você teria que citá-lo também. Mas como esta é uma variável, não precisamos citar isso dentro do JavaScript. Então meu nome já foi definido aqui. Poderíamos pegar isso e colocar lá, se quiséssemos. Mas novamente, para busca de legibilidade, estamos apenas tentando manter tudo separado. E eu só fiz uma pequena atualização aqui para mostrar como formatomais legível formato para o JavaScript. Então, a mesma coisa que temos nossas chamadas Ajax estavam usando post foram configurá-lo para postar, então identificá-lo como post em vez de obter e novamente postar. Se você está enviando dados de formulário, se você tem um monte de dados que você está enviando sobre postagem é definitivamente melhor maneira ir com eles, fique mais seguro. E então aqui está a nossa função de retorno de chamada. Então, literalmente, a mesma coisa que estamos fazendo antes onde nós temos nosso valor lá ou você é l. E então aqui nós temos nossos dados, então nós apenas separamos por comentário e vírgula e nós trouxemos Obter isso para fora. E então esta, por último, vai ser a função de retorno de chamada. E aqui estamos tomando o resultado estavam tomando status. Nós não precisamos necessariamente retirar o status a menos que queiramos usá-lo aqui em baixo. Mas se quisermos usá-la, podemos tirá-la daqui. Então apenas Cônsul, registrando esse status e onde colocar o resultado dentro do resultado não voltará para o código. Podemos ver que o tribunal, de fato, está funcionando da mesma maneira que estava antes. Quando fazemos essa verificação, vemos que o nome é tomado. Fazemos outra coisa que o nome está disponível para que tudo esteja funcionando exatamente da mesma maneira que era antes com get. Embora agora estamos usando post 17. Sucesso de erro de resposta de retorno JQuery AJAX: Então, na última lição, falamos sobre como poderíamos implementar o Post. E então nós olhamos para o código assim e fizemos nosso post. Você é Earl nossos dados e então temos uma função de retorno ligado. E então uma lição anterior nós olhamos para configurá-lo como Ajax fazendo um sucesso você Earl. Então nós vamos voltar a escrevê-lo dentro deste formato onde estamos apenas fazendo em Ajax chamada. Mas vamos definir o tipo, então a mesma coisa onde você pode fazer, obter ou postar neste caso, queremos definir como Post. Temos a URL aqui e depois isto outra vez. Este é um formato muito legível que você Earl vai ser a garota que estamos conectando aos dados que estamos enviando. Então, apenas a listagem desses dados e novamente, se isso fosse uma variação real ou se não fosse um muito ambos era uma string, alguns dados de string, teríamos que citar isso. E depois do sucesso, onde você está apenas publicando que obter essa informação de resultado e nós estamos avaliando o resultado para o diff, então o que for retornado do servidor. Nós simplesmente aparecemos naquele div. Html e aqui nós adicionamos em erro. Então, como tínhamos falado com o barco antes. Então, se houver alguns erros, ou se ele for retornado como um erro, ou se não for um 200 sendo retornado de volta do servidor, então não há dados disponíveis ou a configuração do servidor que cabeçalho 200 podemos puxar o pick up isso e defina-o como um erro. E então nós podemos console logout todo este eso aqui temos X h r, e isso nos dá a capacidade de status, texto, status, texto e ar. Então isso nos dá mais informações sobre esse cabelo. Então, novamente, não é necessário. Se você tiver um erro, você só quer falhar. Se você quiser fazer resultado igual falha. Algo assim, eu poderia simplesmente fazer aquilo onde eu poderia falhar. E agora, quando formos ao tribunal, podemos ver que ainda funciona da mesma maneira. Digite alguma coisa. Fazemos uma verificação para o servidor. O nome está disponível. Se fizermos um que já esteja dentro do nosso array, ele não estará disponível. E, novamente, isso poderia ser trazido para os bancos de dados também. Eso se tivéssemos algo de modo que eu acho que estes desta maneira para fazer uma falha aqui é se eu fizer algo assim ou realmente vai apenas mudar a variável de mineração Então ele não vai realmente ter esse valor de mineração, então espero que ele sai como um erro lá. Eso nós realmente imprimiu esse erro do PHP, então essa não era uma boa maneira de produzir um herdeiro. Provavelmente a maneira mais fácil é fazer um Earl separado. Vai refrescar isso de novo. Então isso realmente escreveu isso porque era o que ele estava sendo devolvido de volta. Eso Havia algum texto dentro desse PHP. Então não foi capaz de dizer se foi um erro. Aqui é o Eso. Nós definitivamente somos capazes de ver se é um erro porque nós não podemos realmente encontrar que verifica com o Z lá sobre PHP eso aqui podemos ver o que está sendo produzido aqui. Então nós não temos encontrado e esta é a resposta do texto de status ex HR. Então, essencialmente , este erro de quatro ou quatro e este é o 404 Então, se fosse 200 ou para outra coisa, poderíamos listar esses erros e não formato eso ou 200 seria sucesso. Eso não encontrado é um erro 404, e vamos ver o que a área é e apenas nos diz que é um erro. E, novamente, esse texto não é encontrado, portanto, o erro não é encontrado valor. E aqui nós somos capazes de colocar no nosso eso falhado vai mudar isso de volta. E isso foi apenas um demonstrar que os erros. Então, se você tem algum herdeiro com os dados, se ele não está voltando da maneira que, como esperado, você pode sempre enviar através do próprio servidor, você pode enviar através de diferentes valores diferentes diferentes status valores. Então, se estamos fazendo um valor 200 ou diferente, você pode definir aqueles do servidor e enviá-los de volta para que você possa automaticamente padrão um erro. Se quisesses mandar de volta outra coisa que não os 200. Ou, se você quiser indicar um sucesso, você pode enviar de volta sucesso novamente, dependendo da estrutura que você está usando, que poderia muito e como você está enviando essas informações de volta para a chamada Jacks. Mas, por enquanto, é importante entender que temos essa chamada do Ajax. Nós somos capazes de fazer essa chamada de volta e fomos capazes de detectar se é um sucesso ou se é um erro e, em seguida, produzir dados de acordo. E apenas para resumir que, sim, consulta J realmente simplifica as coisas em vez do que tivemos que fazer com a idade com JavaScript. E minha maneira preferida de fazer chamadas Ajax é trabalhar com Jay Query. Mas se você precisa trabalhar com JavaScript, nós também temos isso disponível. E é sempre importante. Antes de começar a trabalhar com Jake, preocupe-se em realmente entender o JavaScript por trás dele e como Javascript faz consulta g. Eu sou toda a funcionalidade diferente que tem que ir para apenas o JavaScript base, a fim J consulta para funcionar. Mas Jake Array simplifica o que você está gravando vai ser na cortejamento da biblioteca de codificação que você usa e novamente, uh , novamente, dependendo do tipo de queda que você está pegando, você teria que escolher o melhor método e o que você deseja fazer com ele s para que você possa produzir isso aqui, bem como o que estamos fazendo anteriormente dentro do JavaScript. E a melhor maneira de aprender novamente é baixar os arquivos de origem que foram incluídos na seção de recursos deste curso. Na prática, ele funciona com o código e tenta fazer isso funcionar sozinho para que você não precise necessariamente ter um servidor funcionando. Você pode transformar isso em um arquivo de texto e apenas ter uma resposta lá. Mas se você sabe como configurar um servidor host local, ou se você quiser praticar dentro de um ambiente live no servidor Web, você é bem-vindo para fazer isso também, onde você poderia escrever linguagens de construtor como PHP. Mas novamente, não importa o que você está conectando a ele apenas Ramat Er é o que a resposta do servidor vai ser e novamente ele novamente. Não importa como você está acessando. Se você estiver usando consulta de orgia JavaScript novamente, você está recebendo de volta essa resposta e seu capaz de trabalhar com os dados respondidos e que os dados dinâmicos sem ter uma atualização de página usando o Ajax. E apenas para ilustrar ainda mais que você não precisa necessariamente ter um servidor funcionando, um servidor host local trabalhando em sua máquina aqui. Estamos apenas fazendo uma consulta para testar o texto do arquivo, que é logo aqui. E tudo o que é é este arquivo de teste de trabalho. E quando saímos e atualizamos a página, o que quer que entremos, é apenas para fora colocar esse conteúdo. Então todo o PHP estava fazendo como ele estava atualizando e tornando este conteúdo dinâmico. Então isso estava vindo do próprio PHP, e não necessariamente do JavaScript ou da consulta J para ter essas respostas dinâmicas. Você precisa de uma linguagem construtora que possa interpretar os dados enviados e fazer algo com ele. Personalize a resposta, a mensagem de retorno de chamada que é retornada em você, o JavaScript.