Ajax 비동기 요청 바인딩을 배우는 도장 둘째 날 list_dojo

사용자가 스크롤바를 좋아하지 않아서 탭 전환을 만들었습니다. 사용자가 페이지 새로고침을 좋아하지 않아서 ajax를 사용해야 했습니다. 지난 몇 년간 거의 모든 웹 개발자가 ajax를 조금이라도 안다는 사실을 자랑스러워했습니다. 그러나 Ajax를 사용하는 것만으로는 충분하지 않습니다. 왜냐하면 기술은 사람들에게 도움이 되고 남용될 수 없기 때문입니다. 단순히 텍스트 상자를 확인하기 위해 비동기식 요청을 할 수는 없습니다. 사용자 정보를 업데이트하기 위해 ajax를 사용하는 사람도 있었습니다. 업데이트 중에 ajax가 먼저 멈춰 있었다가 다시 게시되는 현상이 발생했다고 생각하시나요? 이런 사람도 꽤 있습니다. Ajax를 사용하여 업데이트한 다음 위치를 찾는 사람도 있습니다. 그 사람의 Ajax가 무슨 의미가 있나요? 그것은 순전히 그가 그런 것이 있다는 것을 알고 있다는 것을 보여주기 위한 것이었습니다.

Ajax 얘기가 나와서 말인데, 도메인 간 문제에 대해 이야기해야 합니다. 다른 도메인 이름으로 파일을 비동기적으로 요청하면 액세스 보안 문제가 발생합니다. 인터넷에는 대부분 기만적인 솔루션이 있습니다. 그러나 여전히 실현 가능한 두 가지 방법이 있습니다. 예를 들어 aa.com 아래 bb.com의 cc.ashx에 비동기적으로 액세스하려는 경우:

1. aa.com 아래에 dd.ashx 파일을 생성한 다음 ajax를 사용하여 dd.ashx 파일에 액세스할 수 있습니다. 이때 dd.ashx는 도메인 간 문제가 없기 때문에 bb.com 아래의 cc.ashx에 액세스합니다. 비동기적으로 액세스하는 것은 여전히 ​​aa.com과 동일한 도메인에 있는 dd.ashx 파일이기 때문입니다. dd.ashx가 bb.com에 액세스하는 방법에 대해서는 자세히 설명하지 않겠습니다. 도둑 프로그램을 검색해도 원리는 비슷합니다.
2. jsonp가 반환되면 이 방법이 현재 더 인기가 있습니다. 왜냐하면 첫 번째 방법에는 요청이 하나 더 필요하고 이로 인해 필연적으로 속도에 영향을 미치기 때문입니다. 나는 jsonp라는 이름이 전혀 좋지 않다고 생각합니다. 나는 그것을 "json 콜백"이라고 부르는 것을 선호합니다. 그 원칙은 , 이런 식으로 외부 JS 파일에 대한 도메인 간 참조가 없다는 것을 알고 계셨습니까? jsonp는 서버 측에서 json 객체를 반환하고 관련 작업을 수행하기 위해 클라이언트에서 콜백을 수행합니다. 이 물건은 더 많이 들을수록 점점 더 명확해지고 있나요? 더 이상 오해하지 않으시고 직접 검색해 보세요.

그래서 json은 전체 js 학습에서 매우 중요합니다(이 주제는 약간 어렵습니다). 일반적으로 ajax는 json을 반환하므로 dojo에서는 json이 또 다른 필요가 있습니다. 다음 코드에서:

코드를 복사하세요. 코드는 다음과 같습니다:

var jsons= [{},{}];
jsons[0].url="http://www.jb51.net"
jsons[0].text="스크립트 홈"
jsons[ 1].url="http://www.lovewebgames.com";
jsons[1].text="내 웹사이트"
var list=document.getElementById("list")
dojo.forEach(jsons,function(onejson){
var li=document.createElement("li");
li.innerHTML=dojo.string.substitute("${text}",onejson});,);
list.appendChild(li);

한 문장씩 설명하자면, 하지 마세요. 크기가 작기 때문에 무시하세요. 먼저 두 개의 json 개체가 포함된 배열 개체 json을 선언하고 해당 URL과 텍스트에 각각 값을 할당했습니다. 당신도 쉽게 이해할 수 있도록 다음과 같이 작성할 수 있습니다:

var jsons=[{url:"http://www.jb51.net",text:"Script Home"},{url :"http://www.lovewebgames .com/",text:"My website"}];
그런 다음 이 배열을 탐색합니다. 여기서는 두 개의 매개변수가 있는 dojo의 forEach 메소드를 사용합니다. 두 번째는 통과된 각 항목인 매개변수를 갖는 함수 핸들(핸들 또는 대리자라고 부를 수 있음)입니다. 마지막으로 문자열 템플릿을 사용하여 json에서 속성 값을 가져왔습니다. ${url}은 onjson.url, ${text}=onejson.text 값을 가져오는 것과 같습니다. 예를 보려면 여기를 클릭하세요.

이제 일반적으로 사용되는 목록 바인딩을 만들어 보겠습니다. 여기에는 행 스타일 대체, 드래그 가능한 열 너비 및 선택적 정렬과 같은 몇 가지 일반적인 기능이 포함되어 있습니다. 표준 기본 테이블은 다음과 같습니다.

이를 위해서는 새로운 구성요소를 참조해야 합니다. 새로운 테이블 테마 스타일인 MF도 있습니다.

코드 복사 코드는 다음과 같습니다.

> ;
<script> <BR>dojo.require("dojo.parser") <BR>dojo.require("dojo.data.ItemFileReadStore") <BR>dojox.grid. DataGrid" ); <BR></script>


여기에 tundraGrid.css 스타일이 추가되어 테이블의 모양을 제어합니다. ItemFileReadStore 파일은 데이터 소스를 저장하는 데 사용됩니다. 호출은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

jsId="wishStore" url= "services/cigar_wish_list.json">

🎜>

시가	길이/링	Origin	Wrapper	Shape

첫 번째 줄에서는 확장 속성 jsId="wishStore"를 사용하여 div에 데이터 소스를 저장한 다음 테이블의 매장을 위 데이터에 연결합니다. 소스 및 마지막으로 각 열에 확장된 속성 필드를 사용하여 표시할 필드를 바인딩합니다. 바인딩이 성공하더라도 DataGrid에는 clientSort(정렬), autoHeight(자동 너비) 등을 포함한 몇 가지 다른 속성이 있습니다. 자세한 내용은 공식 홈페이지를 참조하세요. 소개

http://dojotoolkit.org/reference-guide/dojox/grid/DataGrid.html
오늘은 콘텐츠가 너무 많아서 내용이 너무 많을 수 있습니다. 약간 피상적이지만 이제 막 시작했다면 시간을 투자하는 것이 더 좋습니다. 구체적인 예시를 보려면 여기를 클릭하여
을 확인하세요.